如何获取在 each 函数中迭代的当前项

How to get the current item being iterated in an each function?

本文关键字:迭代 函数 each 何获取 获取      更新时间:2023-09-26

我有一个嵌套的每个函数,想知道当触发if语句时如何引用this单个项目:

// check if array is empty
if(sameValArr.length === 0)
{
   $(this).hide(); // hide current video thumbnail item
}
else // not empty
{
   $(this).show(); // show current video tbumbnail item
}

还尝试过:

$(item).hide(); $(item[i]).hide();

目前,它一次隐藏了所有具有类名.video-thumbnail的视频,我只想只隐藏当前正在迭代的视频,而不是全部。

全功能:

// check every time the user checks/unchecks inputs to show/hide the video
function checkboxChanged(videoTags)
{
    var checkedAttr = []; // array for checked attributes
    // change event listener for whenever one or more of the following checkboxes have been checked/unchecked
    $('#category-list :checkbox').change(function() 
    {
        checkedAttr = []; // refresh and initialize new array values
        $('#category-list :checkbox').each(function(i, item) // loop thru the input checkboxes
        {
            if($(item).is(':checked')) // item is checked
            {
                checkedAttr.push($(item).val()); // add it to array
            }
        });
        console.log("checkedAttr: ", checkedAttr);
        console.log("init videoTags: ", videoTags);

        // loop through each of the thumbnails to see if video tags match those in checkedAttr array
        $('.video-thumbnail').each(function(i, item)
        {
            console.log(i + " videoTags: ", videoTags);
            // TODO:
            // 1. compare the two arrays if there's any matching values in both
            // 2. if yes, store the matching value in a new array; otherwise do nothing
            // 3. check the new array if it isn't empty 
            // 4. if empty, hide the video; if not empty do nothing (show video)
            var sameValArr = []; // refresh array values
            console.log("INTERSECT: ", arrayIntersection(checkedAttr, videoTags));     // print resulting array intersection
            sameValArr = arrayIntersection(checkedAttr, videoTags); // store same matching array intersection values
            // check if array is empty
            if(sameValArr.length === 0)
            {
                $(this).hide(); // hide current video thumbnail item
            }
            else // not empty
            {
                $(this).show(); // show current video thumbnail item
            }
            console.log("<br/>");
        });
    });
}

更新:

我在调试器上花了一些时间,意识到视频缩略图类的嵌套每个函数将迭代多达九次(存在的视频缩略图类的数量),同时检查每个输入是否有相同的输入,并且由于 sameValArr 几乎总是空的,它会在每次迭代时逐个隐藏视频。仍在尝试修复它...

使用为你传入的对象,item .

     $('.video-thumbnail').each(function(i, item)
        {
            console.log(i + " videoTags: ", videoTags);
            // TODO:
            // 1. compare the two arrays if there's any matching values in both
            // 2. if yes, store the matching value in a new array; otherwise do nothing
            // 3. check the new array if it isn't empty 
            // 4. if empty, hide the video; if not empty do nothing (show video)
            var sameValArr = []; // refresh array values
            console.log("INTERSECT: ", arrayIntersection(checkedAttr, videoTags));     // print resulting array intersection
            sameValArr = arrayIntersection(checkedAttr, videoTags); // store same matching array intersection values
            // check if array is empty
            if(sameValArr.length === 0)
            {
                $(item).hide(); // hide current video thumbnail item
            }
            else // not empty
            {
                $(item).show(); // show current video thumbnail item
            }
            console.log("<br/>");
        });