我正在为一个玩具项目制作数独游戏。我想要做的是返回空白的 id 值并将其放入另一个函数。因此,当我单击该数字时,我希望将其放入空格中,但它不起作用。你们能帮我看看有什么问题吗?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
div {
cursor: pointer;
display: inline-block;
padding: 10px;
}
</style>
</head>
<body>
<div class="item" id="su1" style="border: 1px solid powderblue;" onclick="change_id()"></div>
<div class="item" id="su2" style="border: 1px solid powderblue;" onclick="change_id()"></div>
<div class="item" id="su3" style="border: 1px solid powderblue;" onclick="change_id()"></div>
<div class="number" id='num1' style="border: 1px solid powderblue;" onclick="put_value()">1</div>
<div class="number" id='num2' style="border: 1px solid powderblue;" onclick="put_value()">2</div>
<div class="number" id='num3' style="border: 1px solid powderblue;" onclick="put_value()">3</div>
<script>
function change_id() {
var idname = event.target.getAttribute('id');
return idname;
}
function put_value() {
var get_num_id = event.target.getAttribute('id');
var num = document.querySelector('#' + get_num_id);
document.querySelector('#' + change_id()).textContent = num.textContent;
};
</script>
</body>
</html>
最佳答案
您缺少的是在单击函数时必须从 .html 文件传递 JavaScript 事件对象并捕获函数参数上的事件,您可以使用以下代码:
<div class="item" id="su1" style="border: 1px solid powderblue;" onclick="change_id(e)"></div>
<div class="item" id="su2" style="border: 1px solid powderblue;" onclick="change_id(e)"></div>
<div class="item" id="su3" style="border: 1px solid powderblue;" onclick="change_id(e)"></div>
<div class="number" id='num1' style="border: 1px solid powderblue;" onclick="put_value(e)">1</div>
<div class="number" id='num2' style="border: 1px solid powderblue;" onclick="put_value(e)">2</div>
<div class="number" id='num3' style="border: 1px solid powderblue;" onclick="put_value(e)">3</div>
<script>
var changedId = null; // we create a variable which stored the changed id value
function change_id(event){
changedId = event.target.getAttribute('id');
}
function put_value(event){
var get_num_id = event.target.getAttribute('id');
var num = document.querySelector('#'+get_num_id);
document.querySelector(`#${changedId}`).textContent = num.textContent;
};
</script>
关于javascript - javascript将id值返回给另一个函数不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63576013/