Question

我有一个按钮可以切换引用的div是否可见。最初，我使用的是代码：

$('#search-options-btn').click(function() {
    if ($('#search-options').is('.hidden')) {
        $('#search-options').removeClass('hidden');
    } else {
        $('#search-options').addClass('hidden');
    }
});

但是，为了找到更干净的代码，我遇到了jQuery toggle()方法，根据API有一个方法实现

.toggle( showOrHide )    
showOrHide: A Boolean indicating whether to show or hide the elements.

这个描述让我相信这是一个通过传递...标识符来显示或隐藏的快捷实现方法？ showOrHide方法toggle()。

当然，尝试这个：

$('#search-options-btn').click(function() {
    $('#search-options').toggle(showOrHide);
});

在我的firebug控制台中产生错误：

showOrHide is not defined
[Break On This Error] $('#search-options').toggle(showOrHide);

我也尝试将showOrHide定义为初始化为false的布尔值;错误消失了，但问题并没有解决。

根据jQuery在线API，这应该等同于

if ( showOrHide == true ) {
  $('#foo').show();
} else if ( showOrHide == false ) {
  $('#foo').hide();
}

除非我完全错过这是如何运作的。任何人都可以填写我在这里做错的事吗？我找不到类似的实现。

Answer 1

你应该只需要切换（），别的。

$('#search-options-btn').click(function() { $('#search-options').toggle(); });

Answer 2

showOrHide是内部名称。你传了一个布尔：

$('#...').showOrHide(true)

如果您希望该项目可见，false如果您希望隐藏该项目。

Answer 3

它只是在类之间切换而不是使用布尔值..

$('#search-options-btn').click(function() { $('#search-options').toggle('yourClassName'); });

如果找到 yourClassName ，则会删除相同的内容，否则会添加它。

jQuery .toggle（showOrHide）：实现问题

3 个答案: