Question

我有一个动态生成的面板，当单击一个触发器时，该面板可以从右侧滑入和滑出。

这是HTML：

<div id="panel_wrapper">
    <div class="trigger">
        <a id="trigger"></a>
    </div>
    <div id="panel" class="right">
        <div id="panel_nav">
        </div>
    </div>
</div>

这是jQuery：

$(div).delegate('#trigger', 'click', function() {
    $('#panel').toggle('fast');
});

为了记录，这在Firefox中完美运行。它漂亮地滑入和滑出。但是，它在Chrome或Safari中无法正常工作（尚未在IE中测试）。在Chrome或Safari中测试时，它会成功打开和关闭 ONE 时间。之后，它将不再起作用。这是踢球者。如果我没有通过持续时间间隔|字符串到切换功能，它工作得很好。 $('#panel').toggle();

最初的反应可能是尝试其他方式滑入和滑出，我保证，我已经尝试过了。它们都产生一次正常工作的相同副作用，然后不再起作用。关于地狱到底是什么问题的任何线索？

如果需要更多详细信息，请与我们联系。提前谢谢！

Answer 1

这就是您要找的内容： jsFiddle example 。

<强>的jQuery

$('div.trigger').on('click', '#trigger', function() {
    $('#panel').toggle('fast');
});

此外，从jQuery 1.7开始，.delegate()已被.on()方法取代。

Answer 2

这是你的（不工作）

$(div).delegate('#trigger', 'click', function() {
    $('#panel').toggle('fast');
});

这是我的（工作）

$('div.trigger').delegate('#trigger', 'click', function(e){
    $('#panel').toggle('fast');
});

DEMO.

<强>更好的：

$('div.trigger').on('click', '#trigger', function(e) {
    $('#panel').toggle('fast');
});

原因：有两个div，由于'委托'，两个div都被委派了，所以事件被触发两次而没有指定它，但使用div.classname解决了它。 Check this for debugging.

jQuery切换不适用于持续时间

2 个答案: