隐藏没有文字的链接标签?

时间:2013-08-01 20:14:19

标签: javascript jquery

我创建这个javascript来获取页面上的所有链接并隐藏span标签pearent它如果链接长度== 0.我的问题它隐藏所有span元素与linktext是gerater比0 更新:我包含HTML标记但我在一个页面中有几个视图tile 8,标签ID是lnkBtnTags并且它是环绕标记

<div class="resource" style="position: absolute; left: 240px; top: 0px;">
    <div class="resource-head clearfix">
        <img class="pull-left" src="/ideapark/DesktopModules/ResourcesFilter/img/3.png" alt="icon type" width="36" height="36">
        <p class="resource-title pull-left">
            Learning Strategies
        </p>
        <div class="favorite-resource favorited pull-right">
            <input type="image" name="dnn$ctr687$View$rp_resList$ctl01$imgBtn_bookmark" id="dnn_ctr687_View_rp_resList_imgBtn_bookmark_1" src="/ideaPark/DesktopModules/ResourcesFilter/img/favorite-star-yellow.png">
        </div>
    </div>
    <div class="resource-body">
        <input type="hidden" name="dnn$ctr687$View$rp_resList$ctl01$hf_resID" id="dnn_ctr687_View_rp_resList_hf_resID_1" value="92">
        <p class="resource-subtitle"><a href="http://localhost/ideapark/WebsofWonder/SortingMats.aspx">Sorting Mats</a></p>
        <p>
            Sorting Mats are used to assist students in organizing and classifying data and objects.  
        </p>
        <div class="resource-links">
            <p><a id="dnn_ctr687_View_rp_resList_lb_like_1" class="resource-like" href="javascript:__doPostBack('dnn$ctr687$View$rp_resList$ctl01$lb_like','')">Liked</a> <strong>·</strong> <a id="hl_download" class="resource-download hideLinke" href="/ideaPark/DesktopModules/ResourceModule/pdf_resources/">Download</a>  </p>
        </div>
        <div class="resource-tags clearfix">

            <span class="resource-tag pull-left">
                <a id="lnkBtnTags" class="tagsLinks" href="javascript:__doPostBack('dnn$ctr687$View$rp_resList$ctl01$rp_tagsTopics$ctl00$lnkBtnTags','')"></a>
            </span>

        </div>
    </div>
</div>

Script

    $(".tagsLinks").each(function () {
        var linkTxt = $(this).text();
        console.log(linkTxt.length);
        if (linkTxt.length == 0)
        {
            $(".resource-tag").addClass("hideLinke");
        }

    });

3 个答案:

答案 0 :(得分:4)

如果您定位元素的祖先,请使用上下文和closest

$(this).closest(".resource-tag").addClass("hideLinke");

<强>代码

$(".tagsLinks").each(function () {
    // Cache your selector as you are using it multiple times.
    var $this = $(this), 
        linkTxt = $this.text();

    // trim the white spaces
    if (!$.trim(linkTxt).length) { // equivalent to  === 0
        $this.closest(".resource-tag").addClass("hideLinke");
    }

});

答案 1 :(得分:0)

如果跨度是链接的父级,则只需使用:

$(this).parent().addClass("hideLinke");

答案 2 :(得分:0)

也许改进JQuery选择器?

$(“a.tagsLinks”)也许?