Question

我目前在表单中有2个复选框类别，一个下拉列表和一个提交按钮。按钮应保持“禁用”，直到选中类别A的一个复选框并检查其中一个类别B选项并选择选择列表的选项。它适用于复选框（当我在没有列表的情况下进行测试时），但列表存在问题。当我从上到下填写表单（func - ＆gt; plat - ＆gt; lang）时，它不起作用。不知何故，当我先选择“lang”然后选中复选框时它才有效。当我在选择语言后选中另一个复选框时，它也可以从上到下工作。那真是怪了。所以这是HTML：

<h3>choose func</h3>
<input type="hidden" name="func1" value="" />
<input type="checkbox" name="func1" value="1" id="func1" /> func1 <br/>
<input type="hidden" name="func2" value="" />
<input type="checkbox" name="func2" value="1" id="func2" /> func2<br/>
<input type="hidden" name="func3" value="" />
<input type="checkbox" name="func3" value="1" id="func3"/> func3<br/>
<br/>
<h3>choose plat</h3>
<input type="hidden" name="plat1" value="" />
<input type="checkbox" name="plat1" value="1" id="plat1" /> plat1<br/>
<input type="hidden" name="plat2" value="" />
<input type="checkbox" name="plat2" value="1" id="plat2" /> plat2<br/>
<input type="hidden" name="plat3" value="" />
<input type="checkbox" name="plat3" value="1" id="plat3" /> plat3<br/>
<input type="hidden" name="plat4" value="" />
<input type="checkbox" name="plat4" value="1" id="plat4" /> plat4<br/>
<br/>
<h3>choose lang</h3>
<select name="sprache">
<option disabled selected> -- select an option -- </option>
<option name="deutsch" id="deutsch">Deutsch</option>
<option name="englisch" id="englisch">Englisch</option>
</select>
<br/><br/>
<script>
</script>
<input type="submit" name="abfrage" class="inputButton" id="idAbfragen" value="Abfragen" disabled="">

和jQuery / js：

$(function () {
    $("#func1, #func2, #func3, #plat1, #plat2, #plat3, #plat4, #deutsch, #englisch").change(function () {
        if (($("#func1").is(':checked') || $("#func2").is(':checked') || $("#func3").is(':checked')) 
        && 
        ($("#plat1").is(':checked') || $("#plat2").is(':checked') || $("#plat3").is(':checked') || $("#plat4").is(':checked')) 
        && 
        ($("#deutsch").is(':selected') || $("#englisch").is(':selected')))          
        {   
            $('.inputButton').attr('disabled', false);
        }
        else 
        {
            $('.inputButton').attr('disabled', true);
        }
    });
});

我不知道它为什么不起作用。您可以在我设置的小提琴中重现此问题：https://jsfiddle.net/3zqf4fxv/

我希望有一个解决办法。谢谢和问候！

Answer 1

更改

$("#func1, #func2, #func3, #plat1, #plat2, #plat3, #plat4, #deutsch, #englisch")

到

$(":input")

<强> jsFiddle example

问题在于在您的选择器中使用#deutsch, #englisch。 select元素会更改，而不是选项。 :input只是一个jQuery快捷方式，用于选择示例中已有的内容，但请注意，如果页面上有其他输入元素，则这不是理想的选择。您只需将#deutsch, #englisch替换为select[name='sprache']。

例如：

$("#func1, #func2, #func3, #plat1, #plat2, #plat3, #plat4, select[name='sprache']")

<强> jsFiddle example

JQUERY检查是否选择了列表框选项，用作if循环中的条件

1 个答案: