禁用按钮嗨我有一个表单与多个复选框。应该是,当主选项被选中并且子选项不被选中时,用户不能继续下一步。 我使用下面的代码,但确保当您启用和禁用另一个主选项的另一个子选项时,您可以继续下一步而不检查另一个主选项的子选项。如何禁用一个复选框时,其他检查
的复选框:
<input name="input_1" type="checkbox" value="1" id="choice_1">
<input name="input_1.1" type="checkbox" value="1.1" id="choice_1_1">
<input name="input_1.2" type="checkbox" value="1.2" id="choice_1_2">
<input name="input_1.2" type="checkbox" value="1.3" id="choice_1_3">
<input name="input_1.3" type="checkbox" value="1.4" id="choice_1_4">
<input name="input_2" type="checkbox" value="2" id="choice_2">
<input name="input_2.1" type="checkbox" value="2.1" id="choice_2_1">
<input name="input_2.2" type="checkbox" value="2.2" id="choice_2_2">
<input name="input_3" type="checkbox" value="3" id="choice_3">
<input name="input_3.1" type="checkbox" value="3.1" id="choice_3_1">
<input name="input_3.2" type="checkbox" value="3.2" id="choice_3_2">
的Jquery/JS
$('#choice_1').change(function(){
if($(this).prop('checked')){
if($("#choice_1:checked").length) {
$("#field_18_104").hide(200);
}
checked = $("#choice_1_1:checked").length || $("#choice_1_2:checked").length || $("#choice_1_3:checked").length || $("#choice_1_4:checked").length;
if(!checked) {
var $diverror = $("<div id='error-form' class='error-form'><p>Error text</p></div>");
$("#input_18_26").append($diverror);
$('#form_next_button').prop('disabled', true);
return false;
} else {
$("#error-form").remove();
$('#form_next_button').prop('disabled', false);
}
} else {
$("#error-form").remove();
$('#form_next_button').prop('disabled', false);
// if($('#choice_18_26_3').prop('checked')){
// $('#choice_18_26_3').prop('checked', false).change();
// }
}
});
我也使用用于主选项和选项2和3的子选项的js代码这会导致问题例如当主选项1在没有子选项的情况下被检查并且主选项2或3被子选项检查。然后再次启用该按钮。
因此,实际上有3组子选项,当组1选中主选项并且子选项不是时,组2中的主选项和子选项用户不能继续。
当没有子选项时检查主选项时,用户不应该能够继续。
你意识到你的''元素不是语义/编程组合在一起,因为他们*所有*有不同的'name'属性值?如果这是故意的,我不明白,或*知道*,你的理由,但如果它是偶然的,那么我建议将它们分组在一起:name =“group1”''''name =“group2”'等等。 –
@DavidThomas无法对它们进行分组,是否有可能使用函数修复此问题? – can