使用jQuery动态查找和显示特定部分？

a1o7rhls 于 2023-06-22 发布在 jQuery

关注(0)|答案(2)|浏览(120)

我有一个列，其中包含多个类似类的示例。类为refHeader 1、refHeader 2、refHeader 3和ref 1 select、ref 2select、ref 3select以及refScen 1、refScen 2、refScen 3。下面，数字将被@{@i}替换为动态驱动。我需要的是，当单击（this）ref@{@i}select时，显示最近的refScen@{@i} span，并隐藏所有其余的refScen@{@i} span。到目前为止，我已经尝试了下面的jQuery，没有运气。我做错了什么？在控制台中，当我试图找到最接近的时候，我只是得到空的[ ]括号。先谢谢你了。http://jsbin.com/ezODiTAV/1/edit

jQuery

$("span[class*=select]").click(function () {
        // first hide all refScen spans
        $('span[class^=refScen]').hide();

        // show this refScen span
        //$(this).closest('span[class^=refScen]').show();
        //$(this).find().closest('span[class^=refScen]').show();
        //$(this).find().next('span[class^=refScen]').show();
});

HTML

<div class="col-md-12 padT nPadL nPadR" style="padding-bottom:10px">
    <span class='refHeader@{@i}'>
        <a href="#"><label>@item.Name</label></a>
        <div class="glyphicon glyphicon-chevron-down text-right ref@{@i}select"></div>
    </span>
</div>
<!-- /left options -->             
<span class='refScen@{@i}'>
        <div class="col-md-9 col-md-offset-3 padB nPadL nPadR">
            <a href="#">@listitem.Name</a>
        </div>
</span>

jquery

来源：https://stackoverflow.com/questions/20662843/find-and-show-specific-section-dynamically-with-jquery

2条答案

按热度按时间

tsm1rwdh1#

问题是refScen**不是ref@{@i}select元素的祖先，它是其祖先元素之一的下一个兄弟

$("div[class*=select]").click(function () {
    $('span[class^="refScen"]').hide();
    $(this).closest('.col-md-12').next().show();
    //or $(this).parent().parent().next().show();
});

演示：Fiddle
为了使问题变得更简单，为什么不能给这些元素中的每一个元素再添加一个类，而不需要像

<div class="col-md-12 padT nPadL nPadR" style="padding-bottom:10px">
    <span class='refHeader@{@i} refHeaderrefHeader'>
        <a href="#"><label>@item.Name</label></a>
        <div class="glyphicon glyphicon-chevron-down text-right ref@{@i}select rfselect"></div>
    </span>
</div>
<!-- /left options -->             
<span class='refScen@{@i} refScen'>
        <div class="col-md-9 col-md-offset-3 padB nPadL nPadR">
            <a href="#">@listitem.Name</a>
        </div>
</span>

然后

$(".rfselect").click(function () {
    $('.rfselect').hide();
    $(this).closest('.col-md-12').next().show();
    //or $(this).parent().parent().next().show();
});

赞(0）回复(0）举报 2023-06-22

k4emjkb12#

你错过了一些'和"试试这个：

$("span[class*='select']").click(function () {
        // first hide all refScen spans
        $('span[class^="refScen"]').hide();

        $(this).closest('.col-md-12').next().show()
});

赞(0）回复(0）举报 2023-06-22

我来回答

使用jQuery动态查找和显示特定部分？

2条答案

相关问题

热门标签

最新问答