我的代码中有一个按钮可以将文本“你好”更改为“再见”，但它不起作用。我犯了什么错误？我的代码在我的编码程序中正确缩进。
这是我的代码:
<!doctype html>
<html>
<head>
<title>chat</title>
<meta charset="utf-8" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style type="text/css">
body {
margin:0px;
}
#topBar {
background-color:#33ccff;
width:100%;
height:100px;
z-index:1;
margin:0px;
padding:0px;
position:fixed;
}
“#logo”是包含我要更改的文本的 div 的 ID，“#loginbutton”是我要使用的按钮。
#logo {
width:15%;
height:60px;
float:left;
background-color:white;
margin-left:20px;
margin-top:20px;
}
#login {
width:10%;
height:60px;
float:right;
margin-right:20px;
margin-top:20px;
border-radius:8px;
}
#loginbutton { --this is the button that I want to change the text with
background-color: #lightgrey;
border: none;
color: white;
text-align: center;
text-decoration: none;
font-size: 30px;
cursor: pointer;
width:100%;
height:60px;
border-radius:10px;
font-family:Impact;
line-height:60px;
-webkit-transition-duration: 0.4s;
transition-duration: 0.4s;
}
#loginbutton:hover {
background-color: black;
color: white;
box-shadow: 2px 2px 2px rgba(0,0,0,0.24), 2px 2px 2px 2px rgba(0,0,0,0.19);
}
</style>
</head>
<body>
<div id="topBar">
这是按钮和带有文本的 div:
<div id="login">
<button id="loginbutton">LOG IN</button> <!--This is the button-->
</div>
<div id="logo">hello</div> <!--This is the text I am trying to change-->
</div>
这是我使用的 JavaScript 代码:
<script type="text/javscript">
document.getElementById("loginbutton").onclick=function {
document.getElementById("logo").innerHTML="Goodbye";
}
</script>
</body>
</html>
最佳答案
您需要为本例中缺少的函数指定 ()。
<script type="text/javscript">
document.getElementById("loginbutton").onclick=function() {
document.getElementById("logo").innerHTML="Goodbye";
}
</script>
关于javascript - 为什么这个 HTML 按钮不起作用？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37096434/