jQuery多步骤表单：禁用“下一步”按钮，直到每个部分填入输入

我有一个多步forms，每个

都有不同的输入类型。 我有一个’next’ ，它将在当前触发表单的下一部分。

目前，下一个按钮设置为disabled直到用户满足该字段集的条件 – 即：已检查的无线电/复选框等。

我遇到的问题是我用来将按钮属性切换为.prop('disabled', false);的jQuery .prop('disabled', false); 将整个表单中的所有按钮更改为false 。 是否可以仅在当前

集中定位 ？

此外，如果用户返回某个部分并取消选中所有输入，是否可以禁用下一个按钮？

以下是包含我当前使用的脚本的上一个答案： 禁用按钮，直到单击一个单选按钮

我有一个Codepen，其中包含我正在处理的原型： https ：//codepen.io/abbasarezoo/pen/jZgQOV – 您可以假设每次一个fieldset将一次显示。

代码如下：

HTML：

 
 
 
Select one answer
 Radio 1  Radio 2  Radio 3  
 

Next

Select one answer per row

Row 1

Radio 1 Radio 2 Radio 3

Row 2

Radio 1 Radio 2 Radio 3

Next

Select multiple answers

Checkbox 1 Checkbox 2 Checkbox 3
Next

JS：

 $('fieldset').click(function () { if ($('input:checked').length >= 1) { $('button').prop("disabled", false); } else { $('button').prop("disabled", true); } }); 

在此先感谢您的帮助！

Answer 1

我刚刚将你的js更改为..这将帮助你启用字段集中的当前按钮而不是全部

 $('fieldset').click(function () { if ($('input:checked').length >= 1) { $(this).closest('fieldset').find('button').prop("disabled", false); } else { $('button').prop("disabled", true); } });