Question

我的代码非常简单，但我无法弄清楚如何更改按钮文本。这是代码

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <button id = mybutton> Hello</button>
        <script>
            function onclick(){
            document.getElementById("mybutton").innerHTML="Hi";
        }
        </script>
    </body>
</html>

有人可以弄清楚为什么会这样吗？谢谢。编辑：另请注意，我希望在单击按钮时调用onclick（）。

Answer 1

我建议您使用getElementById捕获元素，然后将事件侦听器绑定到它，而不是直接从DOM引用它。

＆＃13;

var elem = document.getElementById("mybutton"); //catch the elem
    elem.addEventListener('click', function() { //bind 'click' event to it
      this.innerHTML = 'Hi!'; //if clicked, change the clicked element text to 'Hi!'
    }); //this keyword refers to the clicked element, but it can be also just elem.innerHTML = 'Hi!'

＆＃13;

<button id='mybutton'>Hello</button>

＆＃13;

Answer 2

您已定义了一个功能onclick，在调用时，会修改按钮的显示文字。

......你永远不会做任何事情来称呼这个功能。

你没有明确地称之为。您不能将其作为事件监听器附加。你不能将它作为setTimeout的参数传递给你。你完全忽略它。

＆＃13;

function onclick() {
  document.getElementById("mybutton").innerHTML = "Hi";
}

onclick();

＆＃13;

<button id=mybutton> Hello</button>

＆＃13;

Answer 3

您没有将onclick事件绑定到任何元素。这应该工作

<button onclick="this.innerHTML = "hi"> Hello</button>

或在Javascript中绑定事件

document.getElementById("mybutton").onclick = function() { this.innerHTML = "hi" }

或

document.getElementById("mybutton").addEventListener("click",function() { this.innerHTML = "hi" });

或

function edit() { document.getElementById("mybutton").innerHTML = "hi" }

然后

<button onclick="edit()"></button>

或

document.getElementById("mybutton").addEventListener("click",edit);

Answer 4

我认为更好的用途是：

<body>
<button id="myButton" onclick="onclick">
</body>
<script>
function onclick() {
  document.getElementById("mybutton").innerHTML = "Hi";
}
</script>

Answer 5

您可以使用这个简单的代码。

＆＃13;

function clickEvent(){
    document.getElementById("mybutton").innerText="Hi";
}

＆＃13;

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <button id="mybutton" onclick="clickEvent()"> Hello</button>
    </body>
</html>

＆＃13;

Answer 6

您需要添加＆＃34; onClick＆＃34;按钮：

<button id=mybutton onClick="buttonclick()"> Hello</button>
<script>
function buttonclick() {
document.getElementById("mybutton").innerHTML = "Hi";
}
</script>

HTML不更改按钮文本

6 个答案: