Question

由于某种原因，当我点击#display div而不是#button div时，这段代码正常工作，为什么它会像这样，它应该在点击#button时切换，而不是#display ..什么是我做错了吗？

以下是示例代码：

<script>

    $("#button").click( function(){ 

            $("#display").toggle(
                    function(){ alert('On') },
                    function(){ alert('Off') }
            );
     });

</script>

HTML：

    <div id="button"></div>
    <div id="display"></div>

这是一个在线示例（工作）： http://jsfiddle.net/MuMZV/

Answer 1

您将两个函数传递给.toggle()，因此它使用了切换事件方法：http://api.jquery.com/toggle-event/

您可能希望传递持续时间和回调，因此您可以使用此方法：http://api.jquery.com/toggle/

对于jQuery来说，这是一个非常混乱的事情，有两个方法具有相同的名称，但结果却截然不同。

Answer 2

您传入切换功能的值不正确。它可以选择持续时间，缓和和回调。将代码更改为：

$("#button1").click( function(){ 
   $("#display").toggle();
});

导致点击button1 div以切换display div的显示。这个：

$("#button1").click( function(){ 
   $("#display").toggle(2000, function() { alert("toggled"); });
});

使隐藏/减速速度减慢到两秒，并在完成时弹出警报。

如果你想显示真或假，根据切换的元素是否可见，这就是你想要的：

$("#button1").click( function(){ 
   $("#display").toggle(1000, 
       function() { alert($(this).is(":visible")); });
});

Answer 3

以下是您要找的内容：

$('#button').toggle(function() {
    alert('First handler for .toggle() called.'); // On
}, function() {
    alert('Second handler for .toggle() called.'); // Off
});

使用相同的HTML：

<div id="button"></div>
<div id="display"></div>

这是一个有效的JSFiddle：http://jsfiddle.net/mtCry/1/

使用.toggle处理函数的异常活动（）

3 个答案: