试图只为我的数组添加唯一值和" inArray"没有定义?

时间:2016-08-03 13:22:06

标签: javascript jquery

我正在尝试使用与已选中复选框关联的标签填充数组(rulesArray)。我也试图确保我只添加唯一值(这是!inArray进来的地方)。我现在非常确定这是inArray的错误语法。

目前我的错误是"Uncaught ReferenceError: inArray is not defined."

这是我的JS

$(document).ready(function(){
    var rulesArray = [];
    $('input:checkbox').click(function(){
        $('input.selectBox').each(function(){
            if(($(this).is(':checked')) && (!inArray($(this).parent().text(), rulesArray))){
                rulesArray.push($(this).parent().text());
            }
        });
        console.log(rulesArray);
    });
});

这是我的HTML

<div>
    <button class="toggle_button" data-contents=".item_8"></button> 
    <ul class="contents item_8"> 
        <li><input class="selectBox" type="checkbox" id="color_1" name="color_1" value=""><label for="color_1">Red</label></li>
        <li><input class="selectBox" type="checkbox" id="color_2" name="color_2" value=""><label for="color_2">Orange</label></li>
        <li><input class="selectBox" type="checkbox" id="color_3" name="color_3" value=""><label for="color_3">Yellow</label></li>
        <li><input class="selectBox" type="checkbox" id="color_4" name="color_4" value=""><label for="color_4">Green</label></li>
        <li><input class="selectBox" type="checkbox" id="color_5" name="color_5" value=""><label for="color_5">Blue</label></li>
    </ul>
</div>

1 个答案:

答案 0 :(得分:4)

正确的方法是$.inArray - 而非inArray - 您可以使用更好的选择器并使用香草indexOf调用缩短您的代码:

$('input.selectBox').each(function(){
    var isChecked = this.checked;
    var txt = $(this).parent().text();
    var idx = rulesArray.indexOf(txt);

    if (isChecked && idx === -1) {
        rulesArray.push(txt);
    } else if (!isChecked && idx > -1) {
        rulesArray.splice(idx, 1);
    }
});

使用$.map

的解决方案
var rulesArray = $('input.selectBox:checked').map(function() {
    return $(this).parent().text();
}).get();