Jquery 如何检测用户未选中复选框?
以下表格:Jquery 如何检测用户未选中复选框?,jquery,checkbox,form-submit,detect,unchecked,Jquery,Checkbox,Form Submit,Detect,Unchecked,以下表格: <form action="x.php" method="get" id="myForm">Subscribe: <div id="radioButtonsWithAdds"> <input type="radio" name="group1" value="one">One month 2,99$ <input type="radio" name="group1" value="two"> Two mont
<form action="x.php" method="get" id="myForm">Subscribe:
<div id="radioButtonsWithAdds">
<input type="radio" name="group1" value="one">One month 2,99$
<input type="radio" name="group1" value="two"> Two months 5,98$</div><br>
<input type="checkbox" name="option1" value="withAdds" checked> with adds
<img src="next.png" border="0" alt="enviar" onclick="document.getElementById('myForm').submit();">
</form>
订阅:
一个月2,99美元
两个月5,98美元
加上
是来自的订阅的第一部分。在这里,用户可以选择一个月或两个月的订阅
如果用户同意接收添加内容,并选中复选框,则仅此而已,他/她可以点击“下一步”按钮即可
但是如果用户取消选中“with adds”复选框,一个div将显示在#radioButtonsWithAdds的位置,其中包含另一组价格不同的单选按钮
我如何在不点击任何提交按钮的情况下检测复选框的状态?您需要绑定一个事件侦听器,并检查其状态
$('#yourcheckbox').change(function() {
if ( ! this.checked) {
// It is not checked, show your div...
}
});
$('#radioButtonsWithAdds').find('input:checkbox').bind('change', function() {
if(this.checked) {
}
else {
// the user unchecked the checkbox!
}
});
试着用这个
<TD width=550 align=left>
<input type="checkbox" name="adesao" value="sim" id="parte1" onClick="mostra()" /> Sim
<div id="sumula" style="display:none">
<input type="radio" name="conteudo_sumula" value="1" /> <small><i>1x</i></small>
<input type="radio" name="conteudo_sumula" value="2" /> <small><i>2x</i></small>
<input type="radio" name="conteudo_sumula" value="3" /> <small><i>3x</i></small>
</div>
</TD>
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta name="generator" content="test"/>
<title></title>
</head>
<body>
<form action="x.php" method="get" id="myForm" name="myForm">
Subscribe:
<div id="radioButtonsWithOutAdds" style="display:none;">
<input type="radio" name="group1" value="one">One month 1,99$
<input type="radio" name="group1" value="two"> Two months 2,98$
</div>
<div id="radioButtonsWithAdds">
<input type="radio" name="group1" value="one">One month 2,99$
<input type="radio" name="group1" value="two"> Two months 5,98$
</div><br>
<input type="checkbox" name="option1" value="withAdds" checked> with adds
<img src="next.png" border="0" alt="enviar" onclick=
"document.getElementById('myForm').submit();">
</form>
</body>
</html>
下面是一个简单的例子:
您也可以这样做:
$('input[name=subscribe]').change(function() {
if ($(this).is(':checked')) {
// the user selected the checkbox
} else {
// the user de-selected the checkbox
}
});
$(document).ready(function(){
$("#myForm > input[type='checkbox']").click(function(){
if(!$(this).is(':checked'))
{
$("#radioButtonsWithOutAdds").show();
$("#radioButtonsWithAdds").hide();
}
else
{
$("#radioButtonsWithOutAdds").hide();
$("#radioButtonsWithAdds").show();
}
})
})
$('input[name=subscribe]').change(function() {
if ($(this).is(':checked')) {
// the user selected the checkbox
} else {
// the user de-selected the checkbox
}
});