许多按钮,jquery

时间:2012-06-12 18:54:03

标签: jquery

的jQuery

$("#direction").click(function() {
    var direction = $(this).text();
    alert(direction);
}

HTML

<button id="direction">South</button>
<button id="direction">North</button>

只有第一个按钮提醒文字。我不明白为什么。我该如何解决这个问题?

3 个答案:

答案 0 :(得分:7)

你不能拥有两个具有相同id的元素,你可以做的是给它们相同的类,然后在其上添加事件处理程序。

示例:

<button class="directionBtn">South</button>
<button class="directionBtn">North</button>

$(".directionBtn").click(function() {
                var direction = $(this).text();
                alert(direction);
});

答案 1 :(得分:2)

多个元素具有相同的idid 必须 在文档中是唯一的)是无效的;因为jQuery可能在内部实现document.getElementById(),所以它只会(正确地)返回它遇到id的第一个元素。

在您的情况下,您应该使用class方向,并根据该选择:

$('.direction').click(
    function(){/*...*/});

答案 2 :(得分:1)

你不能拥有两个具有相同id的元素,如果你想一次引用多个元素,可以使用类,如:

<button class="direction">South</button>
<button class="direction">North</button>

然后在你的剧本中:

 $(".direction").click(function() {
    var direction = $(this).text();
    alert(direction);
});