2010-12-26 18 views
6

コンテンツの変更イベントが私のdiv要素を変更する必要があります。どのようにjqueryで行うことができますか?いくつかの時間html要素コンテンツ変更イベント

<div id="mydiv>other content</div> 

私がやるよう

$("#mydiv").change(function() { alert('yes'); }); 

によって後

<div id="mydiv">text before</div> 

(function(){ 

      var interval; 

     jQuery.event.special.contentchange = { 
      setup: function(data, namespaces) { 
        var $this = $(this); 
       var $originalContent = $this.text(); 
       interval = setInterval(function(){ 
        if($originalContent != $this.text()) { 
          console.log('content changed'); 
          $originalContent = $this.text(); 
          jQuery.event.special.contentchange.handler(); 
        } 
       },500); 
      }, 
      teardown: function(namespaces){ 
       clearInterval(interval); 
      }, 
      handler: function(namespaces) { 
       jQuery.event.handle.apply(this, arguments) 
      } 
     }; 

    })(); 

$("#mydiv").bind("contentchange", function() { 
    alert('yes'); ///no alert! why? 
}); 

を動作しませんが、私は、コンソールでログを参照してください!

+2

を私は、このためのクロスブラウザのイベントがあるとは思いません。 divのコンテンツはいつ変更されますか?その関数呼び出しにつながる可能性はありますか? –

+1

この投稿を確認してください。あなたが尋ねているのと同様の行にあります:http://stackoverflow.com/questions/1449666/create-a-jquery-special-event-for-content-changed – Chandu

+0

具体的にどのように要素の内容を変更していますか? –

答えて

12

あなたは要素の内容を変更した後は、カスタムイベントをトリガすることができます:

var $mydiv = $("#mydiv"); 

// set up the custom event handler 
$mydiv.bind("contentchange", function() { 
    alert("changed"); 
}); 

// change the content and trigger a custom event 
$mydiv.html("other content").trigger("contentchange"); 

// and again 
$mydiv.html("yet other content").trigger("contentchange"); 
+0

最新の質問 – vinnitu

+0

@vinnituので、Chrome拡張機能は要素の内容を変更していますか?その場合、私のソリューションはそれをカットしません。この質問への答えを確認してください:stackoverflow.com/questions/1449666/ –

1
"The change event is sent to an element when its value changes. 

This event is limited to <input> elements, <textarea> boxes and <select> elements. " 

divでchangeイベントを使用することはできません。

関連する問題