嗨，大家好，我是Jquery和JS的新手，基本上有一个非常简单的问题，我在网上遇到了排序脚本，并且通过浏览jquery文档来尝试了解发生了什么：
脚本如下：
$(function () {
var buttons = $('#fruit,#vegetable,#meat').click(function() {
$(this).toggleClass('active');
var classes = buttons.filter('.active').map(function() {
return this.id;
})
.get().join(',.');
$('div.fruit,div.vegetable,div.meat').hide().
filter('.' + (classes || 'none')).show();
console.log(classes.get().join(',.'));
});
});
并且此脚本在以下HTML上运行：
<div style="float:right; padding:25px;">
<button id="fruit" class="active"><span>fruit</span></button>
<button id="vegetable" class="active">vegetable</button>
<button id="meat" class="active">meat</button>
</div>
<div>
<p>Trying to use buttons as an "or" case rather than "and." When choosing fuit or vegetable, I want to see tomato as part of each list, <em>not just</em> when both are selected.</p>
<div class="fruit">
<p>apple</p>
</div>
<div class="vegetable">
<p>pumpkin</p>
</div>
<div class="vegetable">
<p>okra</p>
</div>
<div class="fruit">
<p>orange</p>
</div>
<div class="meat">
<p>beef</p>
</div>
<div class="fruit vegetable">
<p>tomato</p>
</div>
</div>
在这里摆弄。
现在，我了解脚本的大部分内容，但以下内容除外：
在脚本的第四行，作者使用以下代码：
var classes = buttons.filter('.active').map(function() {
现在button尚未返回任何值，所以它不应该为空吗？
还是通过说以下内容（在第一行上）：
var buttons = $('#fruit,#vegetable,#meat').click(function() {
作者还隐式定义了按钮，如：
var buttons = $('#fruit,#vegetable,#meat')
我努力理解这个简单的概念时，有人可以为我澄清这一点吗？
谢谢你。
亚历克斯-Z
这是一个不寻常的模式，但是在以下语句中buttons确实正确地（并且显式地声明了）：
var buttons = $(...).click(...);
到click发生任何事件时，上述代码将已经执行（因为JS是单线程的），并且buttons已经包含所需的元素集，并且可以在回调中安全地使用。
当然，这也依赖于许多jQuery方法“链接”的方式-它们返回与调用它们的对象相同的对象，因此最终结果是buttons确实包含$('#fruit,#vegetable,#meat')
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句