jQuery的：綁定的元素顯示/隱藏時，其內容被改變

Question

比方說，我有我的網頁上的消息：

<div class="message one">Here is some text.</div> 
... 
<div class="message two">Here is other text for something else.</div> 

我有很多的事件，可能要麼把一些文本消息中，或清除它。

現在我有這個設置，每個消息發送函數調用也檢查消息是否可見，並根據需要更改狀態。這意味着這個基本邏輯有很多重複。

我想設置一個綁定，當任何消息div被改變時觸發，所以如果它被設置爲空，它會向上滑動，如果它被設置爲從空到文本，那麼它會滑落。

這是可能的，如果是這樣，怎麼樣？

Answer 1

每此鏈接，這將被稱爲未在JQuery的支持「突變事件」：Detect element content changes with jQuery

我建議乾脆創建一個輔助函數的邏輯合併到一個地方。例如：

function updateElement(selector, newText) 
{ 
    $(selector).text(newText); 
    if (newText == '') $(selector.slideUp()); 
    else $(selector.slideDown()); 
} 

Answer 2

下面是一些我的頭的頂部，是不是你在尋找什麼，而是要調用的函數更新的div文本時，它會要求你改變DIV類從單獨的類：「消息一個人到一個類的message_one」

<script> 
    $(function(){ 

     function show_message(class, message) 
     { 
      var $div = $('div[class='+class+']'); 

      $div.slideUp(250, function(){ 

       if (message.length > 0) 
       { 
        $div.html(message); 
        $div.slideDown(250); 
       } 
      }); 
     } 

     // example of calling this 

     $('button').click(function(){ 
      // hide the div 
      show_message('message_one', ''); 
     }); 

     $('someotherbutton').click(function(){ 
      // this will slideup and then slidedown 
      show_message('message_two', "<p>Here's my message.</p>"); 
     }); 

    }); 
</script> 

Answer 3

試試這個：

$("div").live("change", function() { 

    if ($(this).text().length == 0) { 

     $(this).slideUp(); 

    } else { $(this).slideDown();} 

});