Question

我在按钮上使用toggle：

$('#button123').toggle(function() {
        $("#button123").text("-");

        $("#slideDiv").slideDown( "fast", function() {

        });
}, function() {
        $("#button123").text("+");

        $("#slideDiv").slideUp( "fast", function() {

        });
});

在我的代码中，我希望＆＃34;重置＆＃34;切换状态。然后让slideDiv向上滑动。

目前我正试图通过以下方式实现这一目标：

    $("#button123").text("+");

    $("#slideDiv").slideUp("fast", function() {
        // Animation complete.
    });

问题是，运行该代码后，我必须按两次button123才能使切换再次起作用。我假设这是因为我不知何故需要重置它？

有什么想法吗？

Answer 1

toggle函数使用内部机制来确定要执行的2个回调中的哪一个。所以假设它是一个增量计数器，如果该值为奇数则为第一个回调，否则执行第二个回调，当您更新文本并显示切换处理程序之外的元素时，不执行内部计数器。所以toggle不知道文本被更改为+的事实，这将导致切换调用第二个处理程序（如果在之前的单击处理程序中执行了一个）。

一种可能的解决方案是使用基于点击的解决方案而不是切换（另一个原因是在1.9中删除了切换）

$('#button123').click(function () {
    var text = $.trim($(this).text());
    $(this).text(text == "-" ? '+' : '-');
    if (text == '-') {
        $("#slideDiv").slideUp("fast", function () {});
    } else {
        $("#slideDiv").slideDown("fast", function () {});
    }
});

演示：Fiddle

jQuery重置切换状态？

1 个答案: