Question

我想知道如果在Javascript中，你点击按钮但他们都有相同的ID。如果我点击第一个，它会提醒ID。但如果我点击第2和第3没有任何反应。我是否必须继续使用javascript或者有更简单的方法吗？

Answer 1

将这些ID更改为class，然后迭代该集并分配点击处理程序：

var buttons = document.getElementsByClassName('button1');
for (var i = 0; i < buttons.length; i++) {
    buttons[i].onclick = function() {
        color=this.value;
        console.log(color);
        document.body.style.backgroundColor= "#" + color;
        if (color!=null && color!="") {
            setCookie1("color",color,1);
        }
    }
}

演示：http://jsfiddle.net/uqVv5/2/

Answer 2

ID必须是唯一的。切勿在多个元素上使用相同的ID。如果您需要多个，请使用课程。

Answer 3

正如一位评论者发布的那样，您必须为按钮使用唯一的ID。发生的事情是只有DOM中的第一个元素才能获得onclick函数赋值。这是一个小提琴手，展示了如何做到这一点。

http://jsfiddle.net/VayxA/

这是改变

document.getElementById('button1').onclick = handleColorClick;
document.getElementById('button2').onclick = handleColorClick;
document.getElementById('button3').onclick = handleColorClick;

function handleColorClick(e) {

    e = e || window.event;
    var targ = e.target || e.srcElement;
    color =targ.value;
    document.body.style.backgroundColor= "#" + color;
     if (color!=null && color!="") {
          setCookie1("color",color,1);
      }
  }

单击按钮（相同的ID）以更改颜色

3 个答案: