0

假设我的页面上有消息:

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

我有很多事件可能会在消息中添加一些文本,或者将其清除。

现在我有这个设置,每个消息发送函数调用也会检查消息是否可见并根据需要更改状态。这意味着这个基本逻辑有很多重复。

我想设置一个在任何消息 div 更改时触发的绑定,这样如果它设置为空,它就会向上滑动,如果它从空设置为有文本,那么它就会向下滑动。

这可能吗?如果可以,怎么做?

4

3 回答 3

3

根据此链接,这将被称为 JQuery 不支持的“突变事件”: Detect element content changes with jQuery

我建议简单地创建一个辅助函数来将逻辑整合到一个地方。例如:

function updateElement(selector, newText)
{
    $(selector).text(newText);
    if (newText == '') $(selector.slideUp());
    else $(selector.slideDown());
}
于 2012-04-15T19:41:08.430 回答
1

这是我想不到的东西,并不是您要查找的内容,而是更新 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>
于 2012-04-15T19:42:40.763 回答
0

尝试这个:

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

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

       $(this).slideUp();

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

});
于 2012-04-15T19:46:11.463 回答