【重新请教一段代码的细节】JS点击checkbox传值到input(不是传“选项”)

hgwyl 2020-10-27 11:01:53
之前请教了几位大哥,得到一段代码。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns=" http://www.w3.org/1999/xhtml">
<head>
<title>JS点击checkbox传值到input</title>
<meta charset="UTF-8">
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"/>
<script type="text/javascript">
function checkedfun() {
var p = document.getElementById("jsrtxt");
var str = this.parentNode.innerText + ";";
if (this.checked) {
p.value += str;
} else {
p.value = p.value.replace(str,"");
}
}
window.onload = function () {
var arr = document.querySelectorAll("input[name=aaa]");
for (var i = 0; i < arr.length; i++) {
arr[i].onclick = checkedfun;
}
}
</script>

</head>
<body>

<input type="text" id="jsrtxt" class="tip" />

<label><input type="checkbox" name="aaa" value="a1"/>复选1</label>
<label><input type="checkbox" name="aaa" value="a2"/>复选2</label>
<label><input type="checkbox" name="aaa" value="a3"/>复选3</label>

</body>
</html>

作用:点击多选框,可以将“选项”显示在input里面;就像“复选1,复选2”这样。
并且是能按照点击顺序显示。

如果我需要将“”显示在input,比如“a1,a2”这样的话,应该怎么改咧……?
菜鸟试了几种写法,但是没有能成功。
请教一下吧
...全文
1392 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
  • 打赏
  • 举报
回复
有一个小技巧 推荐使用 火狐 或者谷歌浏览器 然后启动debugger (F12)

var p = document.getElementById("jsrtxt"); 这句下面加个debugger;
然后看看你这个P里面有啥属性值 然后你就知道怎么写了
gqkmiss 2020-10-28
  • 打赏
  • 举报
回复
这个获取的是 文本内容 var str = this.parentNode.innerText + ";"; 你需要获取 value 值就行了 this.value 就可以了
qybao 2020-10-28
  • 打赏
  • 举报
回复
把 var str=this.parantNode.innerText+”;”; 改成 var str=this.value+”;”; 就可以了

87,901

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧