Question

我目前正在开发显示graphic overlay application内容的Flickr。

我想替换已选择退出的用户的图片。

我的html结构如下：

<ul>
  <li>
    <div class="imgbk">
      <img src='http://farm6.static.flickr.com/5312/7057785005_2966a34f1f.jpg'/>
      <a href='http://www.flickr.com/photos/85152114@N00/7057785005'>Link</a>
    </div>
  </li>
</ul>

此示例中要测试的字符串是位于href。

中的85152114@N00

href结构始终相同： flickr.com / photos / userID / ImageID

到目前为止，这是在服务器方面完成的，但是我网站上的巨大流量迫使我做这个客户端。我的jQuery知识有限，所以我在寻求帮助！

Answer 1

不完全确定您在寻找什么。但是，如果要获取该字符串，可以执行以下操作：

var a = $('.imgbk a').attr('href');
var b = a.split('/');
alert(b[4]);

示例：http://jsfiddle.net/jasongennaro/AQw9X/

基本上，找到href属性，然后将其除以/，将每个部分放在名为b的数组中。我已经提醒结果，所以你可以看到阵列中的哪个项目可供选择，但你可以从那里做任何你想做的事情。

Answer 2

如果您正在寻找的是检查页面中包含该特定代码的任何项目的所有图像的方法，您可以这样做;

var optOutstr = "85152114@N00";

$(img).each(function() {
   if (this.href.match(new RegExp("/" + optOutStr + "/")) {
       this.href = "whatever you want to replace the URL with";
       $(this).prev().attr("src", "whatever you want to replace the image with");
   }
});

如果您要检查完整的代码列表，可以使用更有效的方法对一大堆代码进行检查。

var optOutMap = {"85152114@N00": true, ....};

$(img).each(function() {
   var matches = this.href.match(/flickr.com\/photos\/([^\/]+)\//);
   if (matches && matches[1] in optOutMap) {
       this.href = "whatever you want to replace the URL with";
       $(this).prev().attr("src", "whatever you want to replace the image with");
   }
});

Answer 3

谢谢大家，以下是基于您答案的新代码：

var OptOutArray = ["85152114@N00", "00000000@N00"];

$('img').each(function() {
  var matches = $(this).next().attr("href").split('/')[4];
  if ($.inArray(matches, OptOutArray) > -1) {
    $(this).attr("src", "http://core.flickeflu.com/doh.gif");
  }
});

此处示例：http://jsfiddle.net/jgYs8/

通过文本检测更改图像源

3 个答案: