问题场景:
在注册的时候需要用户选择性别来一个单选,单选来了:
<html>
<form name = "testform" method = "post">
<input type = "radio" value = "man"/>男
<input type = "radio" value = "women"/>女
<input type = "submit" name = "submit" value = "submit"/>
</form>
</html>
好了,问题来了,如果写成以上的样子,就不是单选了。用于可以同时选择男和女~好像有点不对吧?怎么办?
如何让用户在选择女的时候不能选择男,选择女了男就取消~
简单,只需要告诉这个表单,他们两个是一个属性只能选择一个,所以给他们加上相同的name
<html>
<form name = "testform" method = "post">
<input type = "radio" name = "sex" value = "man"/>男
<input type = "radio" name = "sex" value = "women"/>女
<input type = "submit" name = "submit" value = "submit"/>
</form>
</html>
好了~要求又来了,用户注册的时候如果是女,我们需要用户填上三围,但是如果是男就不填如何写呢?
<html>
<form name = "testform" method = "post">
<input type = "radio" name = "sex" value = "man" onclick = "changetype()"/>男
<input type = "radio" name = "sex" value = "women" onclick = "changetype()"/>女
<input type = "submit" name = "submit" value = "submit"/>
</form>
<input type = "text" id = "sanwei" value = "三围" hidden = "hidden"/>
<script>
function changetype(){
var val = document.getElementsByName("sex");
if(val[0].checked){
document.getElementById("sanwei").setAttribute("hidden","hidden");
alert(val[0].value);
}else{
docuemnt.getElementById("sanwei").removeAttribute("hidden");
alert(val[1].value);
}
}
</script>
</html>