はpopModal jQueryライブラリのHTML内の関数を定義しようとすると

Question

私は2つのフィドルの上に私のJSFiddle#2

簡単な説明のにJSFiddle#1の機能をコピーしようとしています：

1）JSfiddle＃1：ユーザーがドロップダウンメニューからthirdオプションを選択すると、アラートポップアップが表示されます。

2）JSFiddle＃2： Iは、フィドル（コードの行のコメント）に示すようにhtml: $('#name_status_popup_dialog').html(),内部このフィドルにJSFiddle #1コードをプラグインしようとしたが、それは動作しません。私がそれをhtml: $('#name_status_popup_dialog').html(),の中に入れているのは、それがダイアログのHTMLコンテンツを表示するためです。 Here is the documentationのhtmlパラメータは、popModalライブラリで使用されます。私はJsFiddle＃2のためにhtml()内のポップアップダイアログの関数を正しく定義していますか？お知らせ下さい。ありがとう

Answer 1

これはコードをhtmlコールバックの外に置くのと同じくらい簡単です。このFiddleを参照してください。また

jQuery(function($) { 
    var id_value; 
    $(document).on('change', '#change_name_statusName', function checkSelection() { 
    const change_name_statusNameVal = this.value 
    console.log("Am I in change listner?"); 

    if (change_name_statusNameVal == "First") { 
     id_value = 1000; 
    } else if (change_name_statusNameVal == "Second") { 
     id_value = 2000; 
    } else if (change_name_statusNameVal == "Third") { 
     alert("Are you sure you want to select third option?"); 
     id_value = 3000; 
    } else if (change_name_statusNameVal == "Fourth") { 
     id_value = 4000; 
    } 
    }); 

    $("#change_name_status").click(function() { 
    $('#change_name_status').popModal({ 

     html: $('#name_status_popup_dialog').html(), 

     onOkBut: function() { 

     var change_name_statusNameVal = $("#change_name_statusName").val(); 

     if (change_name_statusNameVal == "First") { 
      id_value_ = 1000; 
     } else if (change_name_statusNameVal == "Second") { 
      id_value_ = 2000; 
     } else if (change_name_statusNameVal == "Third") { 
      alert("Are you sure you want to select Third option?"); 

      id_value_ = 3000; 
     } else if (change_name_statusNameVal == "Fourth") { 
      id_value_ = 4000; 
     } 
     } 

    }); 
    }); 
}); 

、I要素が動的に生成されるのでdocumentない要素自体にイベントリスナーを取り付け通知。