Question

我正在尝试显示与包含某个单词的h1相关的图像。因此，假设我有20页和20个图像，每个页面都有一个h1，其中包含与内容相关的单词。我希望能够只在该页面的h1中显示与该单词相关的图像。这就是我正在使用的（我在这很糟糕！）试图让它显示一个球的图片。

$(document).ready(function(){
   if ($("h1:contains('ball')").length) {
      $('.post_image').show(<a href="#"><img src="ball.jpg" /></a>);
   }                                           
});

我猜这是各种各样的错误，因为它没有显示任何内容。我需要它不仅能找到并显示单词和图像，而且至少有20种不同。

提前致谢，非常感谢。

Answer 1

你以错误的方式解决这个问题。你不应该检查它可能是的每个单词。你可以用下面的第一行抓住这个词。把它变成一个网址，然后给它一个源。

注意：Haven没有对它进行测试，但你可以用下面几行代码做你想做的事。

    var theWord = $('h1').text();
    var theUrl = theWord + '.jpg';
    $('.post_image').attr('src', theUrl);

Answer 2

我同意Stilly.stack你应该以不同的方式解决这个问题。

如果你真的想检查h1是否包含一个单词，你可以这样做：

$(document).ready(function(){
   var ballSrc = 'http://upload.wikimedia.org/wikipedia/commons/7/7a/Basketball.png';
   if ($("h1").text().indexOf('ball') !== -1) {
      $('.post_image').attr('src',ballSrc);
   }                                           
});

http://jsfiddle.net/aY5Nz/1/

编辑：这也会匹配＆＃34;芭蕾舞女演员＆＃34;等词。所以你应该使用正则表达式

Answer 3

也许这个？

$(document).ready(function(){
   if ($("h1:contains(ball)")) {
      $('.post_image').show('<a href="#"><img src="ball.jpg" alt="ball" /></a>');
   }                                           
});

如果页面h1包含某个单词，则显示某个图像？

3 个答案: