从DIV创建数组,然后检查相似之处

时间:2015-10-02 17:30:06

标签: javascript jquery arrays append

必须制作表格并检查用户是否在textarea中写了某个单词。所有这些单词都是在div中创建的数组中。我被困在验证部分,我想我没有以正确的方式创建阵列。

选中此jsfiddle以更好地了解我想要制作的内容。

<select class="items"></select>
<textarea></textarea>
<div class="sport md">
    <p class="word">word1</p>
    <p class="word">word2</p>
    <p class="word">word3</p>
</div>
<div class="culoare md">
    <p class="word">word1</p>
    <p class="word">word2</p>
    <p class="word">word3</p>
</div>

// POpulare selectbox with options
var menu = ['sport', 'culoare'];
var op = '';
for (var i = 0; i < menu.length; i++) {
    op += '<option value="' + menu[i] + '">' + menu[i] + '</option>';
}
$('.items').append(op);
$('.items').on('change', function () {
    $('.md.active').removeClass('active');
    var appWords = $('.md.' + $(this).val());
    if (appWords.length) {
        appWords.addClass('active');
    }
});

var array = new Array();
$('.md').each(function () {
    array.push($(this).children());
});
$('textarea').on('keyup', function () {
    console.log(array);
    var key = $(this).val().split(' ');
    console.log(key);
    if (key.indexOf(array) > -1) {
        console.log('match');
    }
});

.md{
    display:none;
}
.md.active{
    display:block;
}

1 个答案:

答案 0 :(得分:1)

您的数组未正确构建是正确的。你有一系列段落元素。你想要的是那些段落元素的文本数组。使用jQuery .map()函数。

var array = $(".md p").map(function(){
    return $(this).text();
});

最后,您的匹配比较也存在问题。你有2个数组。您不能使用indexOf来查找两个数组相交的位置。使用jQuery $ .grep和$ .inArray。

var common = $.grep(key, function(element) {
                return $.inArray(element, array ) !== -1;
            });

看到你的小提琴的这个更新: http://jsfiddle.net/1skw4e2b/1/