Question

的jQuery ：

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

HTML

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

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

Answer 1

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

示例：

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

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

Answer 2

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

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

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

Answer 3

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

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

然后在你的剧本中：

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

许多按钮，jquery

3 个答案: