次の方法で、動的に作成された DOM 要素にイベント ハンドラーをアタッチしようとしています。
var createdElement = $('<a>', {
click: function (data) {
alert("click");
}
});
これは期待どおりに機能しますが、変数をクリック関数に渡したいと思います。誰でもこれを行う方法を提案できますか。
次の方法で、動的に作成された DOM 要素にイベント ハンドラーをアタッチしようとしています。
var createdElement = $('<a>', {
click: function (data) {
alert("click");
}
});
これは期待どおりに機能しますが、変数をクリック関数に渡したいと思います。誰でもこれを行う方法を提案できますか。
コードパラドックスの答えは一般的なケースで機能しますが、トリガーされた要素に関係なく、常に同じ値をclick
ハンドラーに渡します。<a>
値がクリックされた要素に依存するようにしたい場合は、要素自体でon()を呼び出すことができます:
var createdElement = $("<a>").on("click", {
yourData: "something"
}, function(event) {
alert("Data is " + event.data.yourData);
}).appendTo("body");
ただし、上記のコードは、質問の構文とは異なる構文を使用しています。click
プロパティ/イベント マップでハンドラーを定義し続けたい場合は、 data()を使用して、値を要素に一度だけ関連付けることができます。
var createdElement = $("<a>", {
click: function() {
alert("Data is " + $(this).data("yourData"));
}
}).data("yourData", "something").appendTo("body");
appendTo("body")
(新しい要素が DOM の一部になり、イベントがトリガーされる可能性があるように、呼び出しを追加したことに注意してclick
ください。コードの後半で要素を DOM に追加する場合は、これを無視してかまいません。)