按钮不工作，使用.addEventListener
按钮不工作，使用.addEventListener
提问于 2022-04-20 13:11:45
我正在用JavaScript创建简单的HTML程序。当我点击按钮时，按钮就不工作了。这是我的代码：
index.html
<!DOCTYPE html>
<html>
<body>
<h1> A random machine</h1>
<p>
Include floating-point number
</p>
<p>
Want an integer? Click here!
</p>
<button id="integerChanges" type="button"> Click me! </button>
<p>
Enter an integer/floating-point number here (start point, included):
<input placeholder="Random number" id="a">
</p>
<br>
<p>
Enter another integer/floating-point number here (end point, not included):
<input placeholder="Random number" id="b">
</p>
<button id="submit"> Submit </button>
<script>
document.getElementById("submit").addEventListener("click", function() {callX()})
document.getElementById("integerChanges").addEventListener("click", function() {
window.location.href="integer.html"
})
a = document.getElementById("a")
b = document.getElementById("b")
a.parseInt()
b.parseInt()
if (a > b) {
throw "start point > end point "
window.location.href="retakeHandler.html"
}
function callX() {
var x = Math.random(document.getElementById("a"), document.getElementById("b"));
console.log(x);
document.querySelector("html").innerHTML = x;
};
function callX2() {
var x2 = Math.floor((Math.random(a,b)) * 10 + 1);
document.querySelector("html").innerHTML = x2;
};
function retakeForm_error() {
var buttonRetake = document.createElement
}
</script>
</body>
</html>integer.html
<!DOCTYPE html>
<html>
<body>
<h1> A random machine</h1>
<p>
Include floating-point number
</p>
<p>
Want an integer? Click here!
</p>
<button id="integerChanges" type="button"> Click me! </button>
<p>
Enter an integer/floating-point number here (start point, included):
<input placeholder="Random number" id="a">
</p>
<br>
<p>
Enter another integer/floating-point number here (end point, not included):
<input placeholder="Random number" id="b">
</p>
<button id="submit"> Submit </button>
<script>
document.getElementById("submit").addEventListener("click", function() {callX()})
document.getElementById("integerChanges").addEventListener("click", function() {
window.location.href="integer.html"
})
a = document.getElementById("a")
b = document.getElementById("b")
a.parseInt()
b.parseInt()
if (a > b) {
throw "start point > end point "
window.location.href="retakeHandler.html"
}
function callX() {
var x = Math.random(document.getElementById("a"), document.getElementById("b"));
console.log(x);
document.querySelector("html").innerHTML = x;
};
function callX2() {
var x2 = Math.floor((Math.random(a,b)) * 10 + 1);
document.querySelector("html").innerHTML = x2;
};
function retakeForm_error() {
var buttonRetake = document.createElement
}
</script>
</body>
</html>retakeHandler.html
<!DOCTYPE html>
<html>
<body>
<h1>
Error: start point > end point
</h1>
<p id="retakeForm"></p>
<script>
function retake() {
var myP = document.getElementById("retakeForm");
// creating button element
var button = document.createElement('BUTTON');
// creating text to be
//displayed on button
var text = document.createTextNode("Click me");
// appending text to button
button.appendChild(text);
// appending button to div
myP.appendChild(button); ;
}
</script>
</body>
</html>编辑了许多版本(这是第3版或第4版)并添加了文件
Repl.it上的公共名称: ElectronicFatherlySale
备注：
- 代码未完成
请帮我解释一下为什么会发生这种事？
回答 1
Stack Overflow用户
发布于 2022-04-20 13:17:20
我在您的代码中看到了几个小错误：
document.getElementById("a") = a;没有任何意义，因为您试图为无法修改的东西设置值，- 声明了两个函数，
callX和callX2，但从未调用它们。我建议您先做以下工作：
--
<script>
document.getElementById("submit").addEventListener("click", function () {
callX();
callX2();
})
function callX() {
var x = Math.random(document.getElementById("a"), document.getElementById("b"));
console.log(x);
document.querySelector("html").innerHTML = x;
};
function callX2() {
document.getElementById("integerChanges").addEventListener("click", function () {
var x2 = Math.floor((Math.random(a, b)) * 10 + 1);
document.querySelector("html").innerHTML = x2;
})
};
</script>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71940309
复制相关文章
相似问题
腾讯云开发者
