カテゴリー: WordPress

モーダルウィンドウ からテキストモードに文字列を挿入する

モーダルウィンドウ編の最終です。今回は前回

HoBoFoTo AMP
モーダルウィンドウ にテキストモードで選択した文字列を表示する
でモーダルウィンドウを表示するところまで、できました。今日はそのモーダルウィンドウにテキストモードで選択して文字列を表示するやり方を見ていきましょう。 関連モーダルウィンドウ にテキストモードで選択した文字列を表示する2...
でモーダルウィンドウに表示した、文字列をテキストモードに挿入する仕方を紹介していきます。

前回の最後のコードを見てみましょう。
function add_quicktags() {
    if (wp_script_is('quicktags')){
?>
    <script type="text/javascript">
        var wpform = jQuery('\
        <div id="my-form">\
            <p class="description">文字表示</p>\
            <table class="form-table">\
                <tr>\
                    <td><label >

16行目で onClick="my_input(this)を指定しています。これで、送信ボタンをクリックするときの処理を実行することができます。その処理は

function my_input(){
    var text = document.getElementById(text').value;
    if(text== ""){
      exit;
    }
    var win = window.dialogArguments || opener || parent || top;
    win.send_to_editor( text );
}

です。ここでは、2行目でIDにtextが設定されているテキストボックスの値を取得しています。
そして、値が空でなければ、6~7行目でテキストモードに文字列を挿入しています。
こうすることで、文字列を挿入することができました。

最後に今回のコードの全容です。

function add_quicktags() {
    if (wp_script_is('quicktags')){
?>
    <script type="text/javascript">
        function my_input(){
            var text = document.getElementById(text').value;
            if(text== ""){
                exit;
            }
            var win = window.dialogArguments || opener || parent || top;
            win.send_to_editor( text );
        }
        var wpform = jQuery('\
        <div id="my-form">\
            <p class="description">文字表示</p>\
            <table class="form-table">\
                <tr>\
                    <td><label >

よかったらクリックしてください。

共有:
Share
Writer:
Dr?Thomas

Recent Posts

USB3.0でUEFI起動する外付けUSBメモリUbuntu19.04を作る

最近は UEFI で起動するパソコンがほ…

3週間 前

Last Quest新章追加

新しい章「2 Ryki's determ…

1か月 前

モーダルウィンドウ にテキストモードで選択した文字列を表示する

でモーダルウィンドウを表示するところまで…

1年 前

テキストモードにモーダルウィンドウを持つボタンを設置する

私は、このサイトを更新するときは、もっ…

1年 前

徳島小旅行

徳島に行ったときの写真です。 (さらに&…

1年 前