Question

Jquery Selector：

//left side
$('section.abstract label.gcsubheader')
//right side
$('fieldset.abstract label.formElems')

两个返回:(类别不同，但for="*"保持不变）

<label for="design" class="displayHidden formElems">Design</label> 
<label for="expertise" class="displayHidden formElems">Expertise</label>
<label for="skills" class="displayHidden formElems">Skills</label>
<label for="tools" class="displayHidden formElems">Tools</label>
<label for="projects" class="displayHidden formElems">Projects</label>
<label for="community" class="displayHidden formElems">Community</label>
<label for="interests" class="displayHidden formElems">Interests</label>

我想向左选择器添加类似于以下内容的内容：

.find($('label[for="' + $(this).text().toLowerCase() + '"]'))

或

var $this = $(this).text().toLowerCase();   //and use the $this in the concatenation:

完成选择labels for="design"的元素，例如选择器($('label[for="design"]'))，但动态执行。我的想法是我第一次尝试重构，并且有很多元素，当我点击一个元素时，我想找到它自己，另一个元素分享它的label for字符串。

我试过了：

$('section.abstract label.gcsubheader').click(function () {
     var $this = $(this).text().toLowerCase();
     //left element - hide
     $('section.abstract label.gcsubheader')..find($('label[for="' + $this + '"]')).show();
     //Right Side - show
     $('fieldset.abstract label.formElems').find($('label[for="' + $this + '"]')).show();
}

和

$('fieldset.abstract label.formElems').find($('label[for="' + $(this).text().toLowerCase() + '"]')).show();

不确定我做错了什么。我是否必须允许另一层抽象来获取/定义元素的文本，或者我的语法是错误的还是其他的东西？我希望得到这个，所以我可以切换左右两个.hidden类，提供一个非常强大的代码重构，可能是这样的吗？：

$('label[for="*"]').click(function () {
   // for each .toggleClass('hidden'); 
}

虽然不太确定如何写*或for each，但我会到达那里。非常感谢您的帮助。

Answer 1

在第一次.调用之前，您还有一个额外的find()，以及一个未封闭的字符串文字作为参数传递给它。请注意内部函数和click方法的右括号。当您可能需要.show()时，您还在使用.hide()作为左侧元素。

此外，将属性equals selector附加到原始选择器语句是完全正常的（我没有你的完整html所以选择器可能需要稍微调整一下）：

$('section.abstract label.gcsubheader').click(function () {
    var $this = $(this).text().toLowerCase();

    //left element - hide
    $('section.abstract label.gcsubheader[for="' + $this + '"]').hide();

    //Right Side - show
    $('fieldset.abstract label.formElems[for="' + $this + '"]').show();
});

至于绑定到任何标签，请考虑使用has-attribute selector代替for='*'：

$('label[for]').click( /* ... */ );

动态属性Jquery选择器attr（'for =“*”'）

1 个答案: