Javascript 创建变量并将其插入jQuery子选择器（“父项”和“子项”）

我一直在尝试创建一个变量，然后使用jQuery（即$（“parent>Child”）将其插入子选择器，但运气不好

我已经包括了jQuery代码的整个适用部分作为参考，其总体思想是当单击导航按钮时，类“.is checked”将添加到导航按钮“.nav collapse”。每个按钮都与通过jQuery应用的唯一数据过滤器相关联

我遇到的问题是，在代码后面，我试图正确调用关联的选中导航按钮的数据过滤器（使用var=sclass），并通过子选择器$（“parent>Child”）将其作为选择器应用，但一直难以使其正常工作

问题在于最后两行代码：

$('.nav-collapse').on( 'click', 'button', function( event ) {
    var $target = $( event.currentTarget );
    $target.toggleClass('is-checked');
    var isChecked = $target.hasClass('is-checked');
    var filter = $target.attr('data-filter');
        if ( isChecked ) {
            addFilter( filter );

        } else {
            removeFilter( filter );
        }

        $grid.isotope({ filter: filters.join(',') });


        $(".masonry-image a").click(function(){

            var sclass = $('.nav-collapse.is-checked').children().attr('data-filter');

            $(" li." + sclass + " > a[href$='-hi.jpg']").addClass("fancybox-button")

但是，如果我将选择器“parent”更改为现有选择器li class=“li class1”，例如：

$(" li.class1 > a[href$='-hi.jpg']")

然后我将要使用的功能有效地工作，所以我知道我走在了正确的轨道上。我还没有找到创建变量然后将其作为父变量插入选择器的任何示例，因此我不确定我的问题是如何设置选择器，还是如何构造变量，或者两者兼而有之

        <nav class="nav-collapse">
            <ul>
                <li><button class="button" data-filter=".class1">Class 1</button></li>
                <li><button class="button" data-filter=".class2">Class 2</button></li>
                <li><button class="button" data-filter=".class3">Class 3</button></li>
            </ul>
        </nav>

        <li class="masonry-image class1">
        <a href="images/shared/00001-hi.jpg">
        <img src="images/shared/00001.jpg" width="308" height="205" alt=""/>
        </a>
        </li>

        <li class="masonry-image class2">
        <a href="images/shared/00002-hi.jpg">
        <img src="images/shared/00002.jpg" width="308" height="205" alt=""/>
        </a>
        </li>

第一类
第二类
第三类

你检查过你的sclass吗？Console.log是您的朋友；）

儿童只能向下移动1级，它只能检查UL。它永远够不到按钮

尝试：

或：

编辑：哎呀，我误解了你的代码，我想你需要：

var sclass = $('.nav-collapse').find('.is-checked').attr('data-filter');

或者这个（注意空格！）：

---

对于最后一行代码，请删除li后面的点，或从数据过滤器中删除点。

是否只需要将字符串串联起来<代码>$（myVar+“>子选择器”）这样做是否有效

$（“li”+sclass+”>a[href$='-hi.jpg'].addClass（“fancybox按钮”）

因为您的数据过滤器中已经有一个“.”，所以您已经复制了“.”twiceAaron，删除“.”单独使用是不起作用的。steel，我尝试按如下方式连接字符串：

var list=“li”；var sclass=$（'.nav collapse.is checked'）.children（）.attr（'data-filter'）；var myVar=list.concat（sclass）

没有你最后确定的两个选项，最后都成功了。谢谢干杯是的，一开始我以为你在给导航添加类，后来我意识到这没有意义。

var sclass = $('.nav-collapse.is-checked button').attr('data-filter');

var sclass = $('.nav-collapse').find('.is-checked').attr('data-filter');

var sclass = $('.nav-collapse .is-checked').attr('data-filter');