获取CheckBox后面的字符串

最新推荐文章于 2022-05-19 14:39:02 发布

原创最新推荐文章于 2022-05-19 14:39:02 发布 · 176 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#HTML

html相关专栏收录该内容

8 篇文章

订阅专栏

本文介绍了一种使用JavaScript从被选中的CheckBox元素后获取文本的方法。通过遍历表单中的CheckBox并利用nextSibling和nodeValue属性，可以收集所有被选中项后的文本，并显示在一个新窗口中。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<title>获取CheckBox后面的字符串</title>
</head>
<script language="javascript">
function yz()
{
var str=""
var flag=0
for(var i=0;i<form1.checkbox.length;i++)
{
if(form1.checkbox[i].checked)
{ str+=form1.checkbox[i].nextSibling.nodeValue+' '
flag++ }
}
if(flag==0)
alert("你还没有选择呢")
else
{ NewDoc=window.open("","",'width=400,height=200')
NewDoc.document.write("<title>选择结果</title>")
NewDoc.document.write("你选择了：" + str +"<hr>")
}

}
</script>
<body>
<p>本示例是获取CheckBox对象后面的文本的演示。<br><br>
提示：在HTML里面只要NAME属性的值一样就默认是数组，可以直接引用。<br>
本示例中用到两个属性分别是：nextSibling、nodeValue<br>
nextSibling 获取对此对象的下一个兄弟对象的引用。（也就是取得后面一个对象）<br>
nodeValue 设置或获取结点的值。(也就是获取当前内容) </p>
<form id="form1" name="form1" method="post" action="">
<input type="checkbox" name="checkbox" value="checkbox1" />
你好
<input type="checkbox" name="checkbox" value="checkbox2" />
谢谢
<input type="checkbox" name="checkbox" value="checkbox3" />
欢迎
<input type="checkbox" name="checkbox" value="checkbox4" />
hello
<input name="checkbox" type="checkbox" value="checkbox5" />
thank you
<input type="button" name="Submit" value="按钮" onClick="yz()"/>
</form>
</body>
</html>