您的位置:首页 > Web前端 > HTML5

更改单选按钮的选项值来改变调查内容

2017-11-26 10:43 267 查看
<!doctype html>

<html>

<head>

<!--更改单选按钮的选项值来改变调查内容-->

<style>

</style>

<script>

function te1(){
var ta=document.getElementsByTagName("table");//获得HTML文档中的table元素的集合,传递的字符串可以不分大小写
var tab=ta[0];//获得table
var ra=document.getElementsByName("select");//获取单选按钮组合
if(ra[0].checked==true){//如果第一个单选按钮被选中
tab.rows[1].innerHTML="<td>喜欢的运动:</td><td><input type=\"checkbox\" name=\"hobby\" value=\"basket\">篮球<input type=\"checkbox\" name=\"hobby\" value=\"tennis\">网球<input type=\"checkbox\" name=\"hobby\" value=\"soccer\">足球</td>";//使用字符串时注意特殊的字符需要使用\进行转义
}
else{
tab.rows[1].innerHTML="<td>个人性格:</td><td><input type=\"checkbox\" name=\"character\" value=\"kailang\">开朗<input type=\"checkbox\" name=\"hobby\" value=\"neixiang\">内向<input type=\"checkbox\" name=\"character\" value=\"huopo\">活泼</td>";
}

}

</script>

<meta charset="UTF-8">

</head>

<body>

<table>

<tr>
<td>信息类型:</td><td><input type="radio" name="select" onclick="te1()" value="hobby" checked="checked">爱好调查  <input type="radio" name="select" onclick="te1()" value="character">性格调查</td>

</tr>

<tr>
<td>喜欢的运动:</td>

<td><input type="checkbox" name="hobby" value="basket">篮球<input type="checkbox" name="hobby" value="tennis">网球<input type="checkbox" name="hobby" value="soccer">足球</td>
</tr>
</table>
</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  html5 radio
相关文章推荐