2

問題は、.html() jQuery 関数の後、ボタンのイベントが停止することです。ここに例があります -

$(document).ready(function() {

    Create();

    $('body div input').click(function() {
       alert('Hello');
       Create();
    });

    function Create() {
       $('body').html('<div><input type="button" value="button" /></div>');
    }

});

ここで、ボタンを初めてクリックするとイベントは機能しますが、Create() 関数が再度呼び出されると、イベントは機能しなくなります。

ちなみに、htmlコードのbodyタグは空欄でCSSも入っていないので、jQueryの問題です。

JSFiddle - http://jsfiddle.net/HVzcy/

4

3 に答える 3

2

クリックの代わりに関数 on() を使用して解決できます。 http://api.jquery.com/on/

 $('body').on('click', 'div input', function() {
   alert('Hello');
   Create();
});
于 2012-10-19T13:13:24.787 に答える
1

これは jQuery の問題ではなく、イベント ハンドラーを確立する方法の問題です。コンテナ (<body>この場合は ) のコンテンツを更新すると、以前のコンテンツはすべて破棄され、それにバインドされたイベントも破棄されます。

要素自体でイベント委任を使用して<body>、ハンドラーが失われないようにすることができます。

$('body').on('click', 'div input', function() {
  alert("hello");
});

これは、ブラウザー (場合によっては jQuery の助けを借りて) がイベントを DOM ツリーに伝達するという事実に依存しています。したがって、ハンドラーをそのセレクターに配置してイベントをフィルター処理することにより、ボディに追加されたすべての要素<body>でいつでも「クリック」イベントを処理できるようになります。<input>

于 2012-10-19T13:14:21.050 に答える
1

更新された回答

jquerydelegateはこれであなたを助けることができます

$(document).ready(function() {

   Create();

   $("body").delegate("div input", "click", function(){
      alert('Hello');
      Create();
   });

   function Create() {
      $('body').html('<div><input type="button" value="button" /></div>');
   }​

});

ここで見ることができます

http://jsfiddle.net/NjuJ2/1/

于 2012-10-19T13:16:02.690 に答える