我正在尝试在我的 html 文档中创建一个 javascript 函数，该函数本质上采用每个 <td> 的值并将其放置在文本框中。非常感谢任何帮助。
<html>
<head>
<script type="text/javascript">
function typeThis(){
document.getElementById('box_1').value = document.getElementById('typewriter');
}
</script>
<style type="text/css">
td{
border:1px solid black;
padding:10px 10px 10px 10px;
font-family:"Helvetica Neue";
font-size:20px;
}
table{
margin-top:50px;
}
</style>
</head>
<body>
<table id = "typewriter">
<td value="k" onclick="typeThis();">k</td>
<td value="c" onclick="typeThis();">c</td>
<td value="y" onclick="typeThis();">y</td>
<td value="s" onclick="typeThis();">s</td>
<td value="p" onclick="typeThis();">p</td>
<input type="text" id="box_1">
</table>
</body>
</html>
最佳答案
value 是 td 的自定义属性，
这样您就可以使用此方法访问它
function typeThis(){
document.getElementById('box_1').value = this.getAttribute("value");
}
旁注: 这就是你的表格应该的样子
<table id = "typewriter">
<tr>
<td value="k" onclick="typeThis();">k</td>
<td value="c" onclick="typeThis();">c</td>
<td value="y" onclick="typeThis();">y</td>
<td value="s" onclick="typeThis();">s</td>
<td value="p" onclick="typeThis();">p</td>
</tr>
</table>
<input type="text" id="box_1">
示例 2:
function typeThis(letter){
document.getElementById('box_1').value = letter;
}
<table id = "typewriter">
<tr>
<td value="k" onclick="typeThis('k');">k</td>
<td value="c" onclick="typeThis('c');">c</td>
<td value="y" onclick="typeThis('y');">y</td>
<td value="s" onclick="typeThis('s');">s</td>
<td value="p" onclick="typeThis('p');">p</td>
</tr>
</table>
关于html - 将 <td> 的值添加到文本框 onclick 时遇到问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8392900/