Question

我是Javascript的新手，我不知道我对这段代码做错了什么。每当我运行代码时，它都无法正常运行，我不知道要用它来改变什么。我试图让它循环通过5个按钮，并用用户在输入框中输入的内容替换按钮的innerHTML。例如，如果用户输入了“馅饼”。在输入框和单击按钮4中，按钮4的innerHTML将重命名为pie。这是我的代码：

var inputValue = document.getElementById("textbox").value;

function click() {
    for (var x = 1; x <= 5; x++) {
        if (this.id == "b" + x) {
            document.getElementById("b" + x).innerHTML = inputValue;
        }
    }
}

for (var i = 1; i <= 5; i++) {
    document.getElementById("b" + i).onclick = click;
}

Answer 1

for (var i = 1; i <= 5; i++) {
   document.getElementById("b" + i).onclick = function(){
         this.innerHTML = inputValue;
   };
}

Answer 2

您只需要在点击处理程序中移动提取输入框内容的行：

function click() {
    var inputValue = document.getElementById("textbox").value;
    for (var x = 1; x <= 5; x++) {
        if (this.id == "b" + x) {
            document.getElementById("b" + x).innerHTML = inputValue;
        }
    }
}

for (var i = 1; i <= 5; i++) {
    document.getElementById("b" + i).onclick = click;
}

这里是fiddle

但实际上，你根本不需要点击处理程序中的循环。你可以这样做：

function click() {
    var inputValue = document.getElementById("textbox").value;
    this.innerHTML = inputValue;
}

Another fiddle

Answer 3

我认为你可以更轻松地做到这一点：

function click(){
    var inputValue = document.getElementById("textbox").value;
    this.innerHTML = inputValue;
}

Javascript代码无法正常运行

3 个答案: