Question

我有两个不同名称和ID的复选框，我希望用户至少检查其中一个，如果没有按钮将禁用！但如果其中一个人检查了它将进入另一个文件

＆＃13;

function validate(){
var time12 = document.getElementById("time12").checked;
var time24 = document.getElementById("time24").checked;

if((time12 == "") && ( time24 == "") )
{
	alert("Choose your hour rate");
	return false;
}
	return true;
}

＆＃13;

   

<input id="time12"  type="checkbox" name="time12" value="12"   />12hours
<input id="time24"  type="checkbox" name="time24" value="24"   />24hours

＆＃13;

但是在你输入仇恨评论之前，我希望你告诉我我已经搜索过它并且我没有这样的问题！

或建议我以其他方式提前谢谢

Answer 1

只需添加onclick()功能即可。

＆＃13;

function validate(){
var time12 = document.getElementById("time12").checked;
var time24 = document.getElementById("time24").checked;

if((time12 == "") && ( time24 == "") )
{
	alert("Choose your hour rate");
	return false;
}
	return true;
}

＆＃13;

<input id="time12"  type="checkbox" name="time12" value="12"   />12hours
<input id="time24"  type="checkbox" name="time24" value="24"   />24hours

<button onclick="validate()" >submit</button>

＆＃13;

Answer 2

要完成此工作，您需要将事件处理程序附加到复选框的change事件。然后，您可以根据元素的已检查状态启用/禁用该按钮。试试这个：

$('.hours').change(function() {
   $('#btn').prop('disabled', !$('.hours:checked').length);
}).change();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>
  <input id="time12" type="checkbox" name="time12" value="12" class="hours" />
  12hours
</label>
<label>
  <input id="time24" type="checkbox" name="time24" value="24" class="hours" />
  24hours
</label>
<input type="submit" value="FORM 3" name="btn_form3" id="btn" />

请注意，我在复选框中添加了一个hours类，并在按钮中添加了#btn的ID，只是为了更容易选择元素。

Answer 3

您要做的是每次选中复选框时，您都希望查看当前是否选中了这两个复选框。

要做到这一点

$( "input:checkbox" ).on("change", function(){
   var checked = false;
   if($("#input1).prop("checked"))
      checked = true;
   if($("#input2).prop("checked"))
      checked = true;
   if(!checked)
      button.prop("disabled",true);
}

Answer 4

请参阅此示例：https://codepen.io/anon/pen/bRXMpx

<script>
function validate(){
var time12 = document.getElementById("time12").checked;
var time24 = document.getElementById("time24").checked;

if((time12 == "") && ( time24 == "") )
{
    document.getElementById("btn").disabled = true;
    alert("Choose your hour rate");
    return false;
}
else
document.getElementById("btn").disabled = false;
    return true;
}
</script>
<html>
<input id="time12"  type="checkbox" onclick="validate()" name="time12" value="12"   />12hours
<input id="time24"  type="checkbox" onclick="validate()" name="time24" value="24"   />24hours
<input type="submit" id="btn" value="FORM 3" onclick="validate()" name="btn_form3" > 
</html>

如何在javascript中验证两个复选框

4 个答案: