0

我有一个在整个文档中多次使用的简单 HTML 模板。它本质上是以下div元素,它围绕着几个p元素和另一个div带有 class 的元素button。出于可视化目的,这是一个示例:

<div class="content">    
    <p>First paragraph</p>
    <p>Second paragraph</p>

    <div><a class="button" href="http://www.apple.com/ipad/">Change me jQuery!</a></div>
</div>

<div class="content">    
    <p>First paragraph</p>
    <p>Second paragraph</p>

    <div><a class="button" href="http://www.apple.com/iphone/">Change me jQuery!</a></div>
</div>

现在,将使用此模板在网站上发布内容的用户并不总是会在该锚标记中使用完全相同的 url,但我确实知道他们可以使用哪些。所以我试图用我的代码做的是:

  1. 一旦内容发布并且锚标签给出了一个 url 地址,我想检查该地址并查看其中是否有特定的单词。如果找到该词,则将锚文本更改为我选择的内容。
  2. 再次执行相同操作,但这次检查 url 字符串中的不同单词。

这是我写的:

$('.content').each(function () {
    var $this = $(this),
        $findP = $this.find('p');

    if ($findP.length > 2) {
        // Run some code
    } else if ( ($findP.length <= 2) && ($('a[href*="ipad"]')) ) {
        $this.find('a.button').text('Visit iPad site');
    } else if ( ($findP.length <= 2) && ($('a[href*="iphone"]')) ) {
        $this.find('a.button').text('Visit iPhone site');
    }
});​

问题:

  • 两个锚标记的文本更改为我在jQuery 方法内的第一个else if语句中编写的文本字符串。.text()在我的示例中,第一个锚标记应采用文本“访问 iPad 站点”,而第二个锚标记应采用“访问 iPhone 站点”。这是这个例子的一个工作小提琴:http: //jsfiddle.net/vj4xZ/1/

我猜问题出在这里,一旦找到第一个元素,所有锚标记都被分配 .text() 方法中的内容,代码就停在那里而不寻找第二个else if语句中的内容。如果是这种情况,或者手头的问题是其他问题,那么我怎样才能让它正常工作?对此的任何帮助将不胜感激。感谢您的时间!

4

2 回答 2

3

http://jsfiddle.net/zerkms/vj4xZ/2/

您需要将条件更改为:

} else if ( ($findP.length <= 2) && ($this.find('a[href*="ipad"]').length) ) {

$('a[href*="ipad"]')- 表示 - 如果文档中某处有带有ipadin href的锚点

我改变的 - 仅限于通过当前元素搜索锚点$this.find()

您也可以$('a[href*="ipad"]', $this)改用,它会做同样的工作

于 2012-05-29T04:03:07.617 回答
1

Hiya 在这里做了一个不同的演示:http: //jsfiddle.net/bKJfq/15/

上面的演示使用了这个选择器之一:http: //api.jquery.com/category/selectors/

http://api.jquery.com/attribute-contains-selector/

一旦选择器匹配,它会将文本更改为您想要的所需文本。

这很可能是不那么冗长的方式;如果我错过了什么,请告诉我。

希望这会有所帮助 B-)

代码

   $('a[href*="ipad"]').text("Visit iPad site");
   $('a[href*="iphone"]').text("Visit iPhone site");
于 2012-05-29T04:22:25.287 回答