0

我认为这可能是一个传递参数的问题，但我还是 jQuery 的新手。我有两个以 jQuery 函数开始的块元素，它们相互重新设置样式。但是当我使用 jQuery 用相同类型的代码替换那些块元素的内容时，重新样式功能不再起作用。

这是我正在使用的核心：

$(document).ready(function() {
    $('#baz').click(function() {
        $('#bar').replaceWith('<div id="bar">' + 'texttexttexttexttext' + '<span id="hl1" class="nohighlight">' + 'some other stuff to be highlighted' + '</span>' + 'texttexttexttext' + '</div>');
        $('#foo').replaceWith('<div id="foo"><span id="rollover1">' + 'Look at this!' + '</span></div>');
    });

    $('#rollover1').mouseenter(function() {
        $('#hl1').removeClass('nohighlight').addClass('highlight');
    });

    $('#rollover1').mouseleave(function() {
        $('#hl1').removeClass('highlight').addClass('nohighlight');
    });
});​

...

<div><a href="#" id="baz">change</a></div>
<div id="foo"><span id="rollover1">HEY!</span></div>
<div id="bar">blahblahblah<span id="hl1" class="nohighlight">blahblahblahblah</span>blahblahblah</div>​

见http://jsfiddle.net/xdP7Z/4/

4

1 回答 1

1

您正在动态更改元素，因此您需要委托

$(document).ready(function() {
    $('#baz').click(function() {
        $('#bar').replaceWith('<div id="bar">' + 'texttexttexttexttext' + '<span id="hl1" class="nohighlight">' + 'some other stuff to be highlighted' + '</span>' + 'texttexttexttext' + '</div>');
        $('#foo').replaceWith('<div id="foo"><span id="rollover1">' + 'Look at this!' + '</span></div>');
    });

    $('body').on('mouseenter','#rollover1', function() {
        $('#hl1').removeClass('nohighlight').addClass('highlight');
    });

    $('body').on('mouseleave','#rollover1',function() {
        $('#hl1').removeClass('highlight').addClass('nohighlight');
    });
});

小提琴

最好委托给 dom 中存在的最近的父元素，因此您应该替换body为静态父元素。通过委派您将事件处理程序附加到父元素 - 然后侦听事件冒泡并处理事件。

我使用 .on() 制作了我的示例，因为我看到您选择了 jQuery 1.8，但是如果您使用的是较旧的库 - 这是您应该如何选择使用哪种方法

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+
于 2012-09-21T17:48:33.637 回答