javascript - 从 DIV 创建数组，然后检查相似性

Question

必须制作一个表单并检查用户是否在文本区域中写入了某个单词。所有这些单词都位于由 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;
}

Answer 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;
            });

查看你的 fiddle 的更新: http://jsfiddle.net/1skw4e2b/1/