0

.clone()ユーザーのクリックに応じて、jqueryを使用してページにHTMLを追加しています。

新しく作成したHTMLにonclickハンドラーを追加したいと思います。将来作成されるHTMLでイベントをトリガーするために使用できることは知っていますが、HTMLを作成する前に.on()、それを記述(および実行)する必要があると思います。

このサンプルコードでは、ユーザーが選択リストから「related_id」を選択すると、jqueryはユーザーがIDを入力できるフィールドを作成します。ここにajaxyを追加して、ユーザーがIDの代わりに関連アイテムの名前を入力できるようにします。ajaxリクエストは、ユーザーが選択したフィールドによって異なります。

一般的に言って、jqueryを使用してajaxリクエストを作成する方法は知っていますが、フィールド固有のajaxコードを新しく作成したHTMLに追加するにはどうすればよいですか?

4

3 に答える 3

2

jsfiddleにはたくさんのコードが含まれていますが、そのほとんどはこの質問とはほとんど関係ありません。いずれにせよ、私があなたを正しく理解していれば、あなたが説明を求めているのはとにかくかなり高レベルです。

私が最初にすることはclass、すべての新しい要素に共通点を含めるようにすることです。次に、次のようにクリックイベントにバインドし.on()ます。

$("#parentElement").on('click','.newClass', function() {
    var me = $(this).text(); //gets the specific text from each .newClass element when clicked
    doAjaxRequest( me );
}

#parentElementこのクリックハンドラーを作成する前に、DOMに注意が必要です。

あなたのdoAjaxRequest関数は次のようなものになります:

function doAjaxRequest( elemText ) {
    $.ajax({
        ...
        data: elemText,
        ...
    });
}

.on()これについては、jQuery1.7以降で注意が必要です。古いバージョンについては、次のオプションを参照してください。

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+

バージョン1.4.4の場合。コードは次のようになります。

$("#parentElement").delegate('.newClass', 'click', function() {
    var me = $(this).text(); //gets the specific text from each .newClass element when clicked
    doAjaxRequest( me );
}
于 2012-07-11T04:02:53.477 に答える
1

<script type='text/javascript'> ... your jquery code here </script>HTML の残りの部分と一緒にタグを挿入できます。

于 2012-07-11T03:41:09.167 に答える
1

$cloneハンドラーをドキュメントに追加する前に、ハンドラーを にバインドしてみませんか?

$clone.on("change", function(){
  //Do my AJAX  
});
于 2012-07-11T03:43:08.440 に答える