javascript - 检查动态创建的数组中是否存在所选选项

Question

我有一些看起来像这样的代码。 select#member_id 的值由 PHP 动态添加。我试图确定用户是否从列表中选择 res 或 com 选项，这将确定我是否动态添加第二个下拉列表。按照原样的代码，我始终收到脚本发出的 -1 警报。 console.log 调用打印出:[1, 3] [2]。

<script>
var res_members = new Array();
var com_members = new Array();
</script>
<p><select name="member_id" id="member_id">
    <option value=""></option>
    <option value="1">Alice (res)</option><script>res_members.push(1);</script>
    <option value="2">Bob (com)</option><script>com_members.push(2);</script>
    <option value="3">Carl (res)</option><script>res_members.push(3);</script>
</select></p>
<script>
    console.log(res_members, com_members);
    $(function(){
        $('#member_id').change(function(){
            alert($.inArray($('#member_id').val(), res_members));
            alert($.inArray($('#member_id').val(), com_members));
        });
    });
</script>

Answer 1

为什么不选择像这样更简单、更方便的东西:

<p><select name="member_id" id="member_id">
    <option value=""></option>
    <option class="res" value="1">Alice (res)</option>
    <option class="com" value="2">Bob (com)</option>
    <option class="res" value="3">Carl (res)</option>
</select></p>
<script>
    $(function(){
        $('#member_id').change(function(){
            var isRes = $(this).find(':selected').hasClass('res');
            alert(isRes ? "res" : "com");
        });
    });
</script>

<强> See it in action 。

更新:为什么您当前的代码不起作用

这是因为您在使用 $.inArray 搜索字符串时将整数插入数组(使用 push)。更改其中任何一个都会使现有代码正常工作。

因此一种解决方案是插入字符串:

<option value="1">Alice (res)</option><script>res_members.push("1");</script>
<option value="2">Bob (com)</option><script>com_members.push("2");</script>
<option value="3">Carl (res)</option><script>res_members.push("3");</script>

另一种方法是寻找整数:

alert($.inArray(parseInt($(this).val()), res_members));
alert($.inArray(parseInt($(this).val()), com_members));

显然$.inArray使用运算符===将干草堆元素与针进行比较。