代码之家 › 专栏 › 技术社区 › Andreas Grech

一次性将事件附加到多个元素

events jquery javascript

Andreas Grech · 技术社区 · 16 年前

var a = $("#a");
var b = $("#b");

//I want to do something as such as the following : 

$(a,b).click(function () {/* */}); // <= does not work

//instead of attaching the handler to each one separately

$ context

那么,我如何一次将事件附加到这两个元素上呢?

[更新]

peirix 发布了一个有趣的片段,其中他将元素与 & 标志;但我注意到了一件事:

$(a & b).click(function () { /* */ }); // <= works (event is attached to both)

$(a & b).attr("disabled", true); // <= doesn't work (nothing happens)

从上面你可以看到,显然,与 & 该标志仅在附加事件时有效。..?

9 回复 | 直到 8 年前

Gareth 16 年前

这 jQuery add method 这就是你想要的:

将更多与给定表达式匹配的元素添加到匹配的元素集中

var a = $("#a");
var b = $("#b");
var combined = a.add(b)

hobbs 16 年前

也不要忘记jQuery选择器支持CSS逗号语法。如果你需要组合两个任意的集合,其他人的建议都是正确的,但如果它像对带有ID的元素做点什么一样简单 a 和 b $('#a,#b') .

The Brawny Man 16 年前

$("#a, #b").click(function () {/* */});

更新: 我只是重读了这篇帖子,错过了你关于将有问题的节点保存到变量中的评论,但这种方法仍然有效,只需要一个小提示。您将要执行以下操作:

var a = $("#a");
var b = $("#b");
$(a.selector+", "+b.selector).click(function () {/* */});

jquery做的一件很酷的事情是,它向返回的节点添加了一些特定于jquery的属性(选择器,即用于抓取该节点的原始选择器就是其中之一)。如果您使用的选择器已经包含逗号,则可能会遇到一些问题。这也可能是有争议的,如果这比使用add更容易,但这是一个有趣的例子,说明jquery有多酷:)。

Greg 16 年前

你可以把它们放在一个数组中:

$.each([a, b], function()
{
    this.click(function () { });
});

Andrey Borisko 13 年前

你为什么不使用数组?这对我来说是有效的:

$([item1, item2]).on('click', function() {
      // your logic
});

peirix 16 年前

我只是试着摆弄一下,发现了一些很酷的东西:

$(a & b).click(function() { /* WORKS! */ });

超甜!

编辑: 现在我真的很尴尬,因为没有正确地测试这个。这实际上是将点击事件放在一切但我不知道为什么会这样。..

camainc 12 年前

您还可以创建一个类名,并给出要与该类一起使用的每个元素。然后,您可以将事件绑定到共享该类的所有元素。

<p><a class="fakeClass" href="#">Click Me!</a></p>

<p><a class="fakeClass" href="#">No, Click Me!</a></p>

<div class="fakeClass">Please, Click Me!</div>

<script type="text/javascript">
    $(function () {
        $(".fakeClass").on("click", function () {
            alert("Clicked!");
        });
    })
</script>

jrharshath 16 年前

试试这个:甜蜜而简单。

var handler = function() {
    alert('hi!');
}
$.each([a,b], function() {
    this.click(handler);
}

顺便说一句,这种方法不值得麻烦。

如果你已经知道只有两种方法,那么我想最好的选择是

a.click(handler);
b.click(handler);

干杯

VMAtm 12 年前

例子:

$("[name=ONE_FIELD_NAME], [name=ANOTHER_FIELD_NAME]").keypress(function(e){alert(e.which);});