Question

我希望能够根据HTML内容禁用链接。有许多可用的分类部分，但并不总是填写。我希望链接显示为灰色，以便终端查看者知道该分类没有内容。我的HTML结构如下所示：

<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <p><a class="fancyTxt" href="Classifieds/050.html">050 Farms For Rent</a></p>
</div><!--"col-xs-12 col-sm-6 col-md-4 col-lg-4-->
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <p><a class="fancyTxt" href="Classifieds/051.html">051 Houses For Rent</a></p>
</div><!--"col-xs-12 col-sm-6 col-md-4 col-lg-4-->
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <p><a class="fancyTxt" href="Classifieds/052.html">052 Miscellaneous</a></p>
</div><!--"col-xs-12 col-sm-6 col-md-4 col-lg-4-->

每种类型的分类都有一个HTML文件，因为这是我们的分类程序输出的内容。如果分类中没有任何内容，则会将一串文本作为页脚放置，但此文本也位于每个分类的HTML文件中。这是文字：

<p>www.domainname.com<BR>
Your source for local online<BR>
classifieds!</p>

我希望搜索该文本以禁用链接，这是在分类中显示的唯一文本。

谢谢！

编辑：包含内容的分类页面示例。

<!-- Classification Title Here -->
004 Announcements


<!-- Begin output Ad Text  <startTags> </startTags> -->

 <p><FONT SIZE=3>text about classified here</FONT></p><BR><HR>

 <p><FONT SIZE=3>Text about classified here </FONT></p><BR><HR>

 <p><FONT SIZE=3><DIV ALIGN=CENTER>www.domainname.com<BR>
Your source for local online<BR>
classifieds!</DIV></FONT></p><BR><HR>

<!-- End output Ad Text <endTags><BR><HR></endTags> -->

Answer 1

由于您的问题不在于禁用链接，而是要找到需要禁用的容器，可以尝试以下方法：

$('.col-xs-12.col-sm-6.col-md-4.col-lg-4').each(function() {
    var p = $(this).children('p');
    if (p.length === 1 && p.text().match(/^www\.domainname\.com/i) !== null) {
        // disable link within $(this)
    }
});

这会抓取所有子段落元素，并确保只有一个，并且其内容以“页脚”内容开头。

Answer 2

这应该可行，HTML：

<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <p><a class="fancyTxt" href="Classifieds/050.html">050 Farms For Rent</a></p>
</div><!--"col-xs-12 col-sm-6 col-md-4 col-lg-4-->
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <p><a class="fancyTxt" href="Classifieds/051.html">051 Houses For Rent</a></p>
</div><!--"col-xs-12 col-sm-6 col-md-4 col-lg-4-->
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
    <p><a class="fancyTxt" href="Classifieds/052.html">052 Miscellaneous</a></p>
</div><!--"col-xs-12 col-sm-6 col-md-4 col-lg-4-->

JAVASCRIPT：

$('div p:contains("Rent")').find('a').on('click', function(evt) {
    evt.preventDefault();
    return false;
});

这应该禁用文本中包含“Rent”的所有链接。

http://jsfiddle.net/46Zky/

jQuery用于根据其html内容禁用链接

2 个答案: