HTML表单单选按钮和复选框

时间:2018-08-29 10:40:59

标签: javascript jquery html

我想创建一个表单,如果选中了一个单选按钮,则会打开一些与之相关的复选框,并且用户必须在提交该表单之前选择该单选按钮下的至少一个复选框。例如,请参考codepen:https://codepen.io/anon/pen/zJKPRK。这是基于我看到的狗/猫教程。

此处,物料传播用于制作所需的所有子物料:

var FormStuff = {

init: function() {
    this.applyConditionalRequired();
    this.bindUIActions();
  },

  bindUIActions: function() {
    $("input[type='radio'], input[type='checkbox']").on("change", this.applyConditionalRequired);
  },


  applyConditionalRequired: function() {


$(".require-if-active").each(function() {
  var el = $(this);
  if ($(el.data("require-pair")).is(":checked")) {

    el.prop("required", true);
  } else {
    el.prop("required", false);
  }
});
},   
};
FormStuff.init();

这里至少需要选择1个单选按钮,并且如果选择了ClassB或ClassC,我希望用户应在该特定类下至少选择一个复选框。有什么建议吗?

1 个答案:

答案 0 :(得分:0)

.length为您提供选择中元素的数量。 $('input[type="checkbox"]').is(':checked').length > 0告诉您是否已至少选中1个复选框。只需根据需要将类添加到您的选择器即可。