Question

是否有可能在jQuery中“链接”两个CSS元素？

我项目的一个例子：
当某些事情发生时，我想立即将.focused类附加到多个元素。它们的ID都有相同的前缀，但这些前缀中只有1个（例如#first-header - #first-button; #second-header - #second-button等等。它可能会使用一些正则表达式，但我似乎无法弄清楚这些东西。

一个更准确的例子，因为我不善于解释事情：
如果#first-header为.focused，请将同一.focused课程附加到#first-button。这需要适用于任何一对 -header 和 -button 。

我希望我能够很好地解释它，并感谢任何帮助。

Answer 1

您可以轻松选择ID为first-的所有项目

$('[id^="first-"]').addClass('whatever');

Answer 2

听起来，您应该使用类，而不是在HTML元素的ID中使用模式。

示例HTML：

<div id="first-button" class="button">...</div>
<div id="second-button" class="button">///</div>

使用Javascript：

$(".button").click(function(){ /*do stuff*/});

Javascript会将点击处理程序附加到具有类button的所有div元素。

Answer 3

一个元素不能有多个ID。做你正在做的事情的正确方法是给你想要改变像“toFocus”这样的类的所有东西

Answer 4

$('[id$="header"]').on('focus blur', function(e) {
    $('#' + this.id.split('-').shift() + '-button').toggleClass('focused', e.type=='focus');
});

FIDDLE

Answer 5

试试这个：

$("[name$='header']").focus(function(){
    var t = $(this).attr("id").split("-")[0];
    $("#"+t+"-button").addClass("focus");
});

链接jQuery中的两个元素

5 个答案: