Question

我想在系列类中找到href，然后用相同的链接替换[PAGEURL]。我还需要这个来重复页面上每个.details类的功能。

以下是我正在使用的JavaScript -

$(function() {
  var links = $('.details'),
    matchExp = /\[PAGEURL\]/,
    currentURL = $('.series').attr('href');

  links.each(function() {
    var currentHREF = $(this).attr('href');
    if (currentHREF.match(matchExp)) {
        $(this).attr('href',currentHREF.replace(matchExp,currentURL));
    }
  });
});

这是HTML

<div class="details">
  <div class="series">
    <a href="MyLink.php">text</a>
  </div>
  <fb:comments-count href=[PAGEURL]></fb:comments-count>
</div>

Answer 1

我不认为你需要在这个例子中使用正则表达式 jQuery为您提供了足够的工具来完成工作。

以下是我在某些链接占位符上完成“搜索和替换”功能的方法：

给出以下HTML -

<div class="details">
  <div class="series"><a href="my_cool_page.php">text</a></div>
  <fb:comments-count href="[PAGEURL]"></fb:comments-count>
</div>

<div class="details">
  <div class="series"><a href="awseome_content.php">text</a></div>
  <fb:comments-count href="[PAGEURL]"></fb:comments-count>
</div>

<div class="details">
  <div class="series"><a href="interesting_stuff.php">text</a></div>
  <fb:comments-count href="[PAGEURL]"></fb:comments-count>
</div>

这个jQuery可以解决这个问题 -

$(function(){
    // this grabs all the div elements with the class "details"
    $("div.details").each(function(index,elem){

      // within each details <div>, we look for an <a> element, and
      // we save its href value in currentURL
      var currentURL = $(this).find('div.series > a').attr('href');

      // again within the details <div>, we search for any element who's href
      // property contains [PAGEURL] and replace is with the value
      // we got from the series <a> tag.
      $(this).find('*[href*="[PAGEURL]"]').attr('href',currentURL);
    });
});

最终的预期结果应如下所示 -

<div class="details">
  <div class="series"><a href="my_cool_page.php">text</a></div>
  <fb:comments-count href="my_cool_page.php"></fb:comments-count>
</div>

<div class="details">
  <div class="series"><a href="awseome_content.php">text</a></div>
  <fb:comments-count href="awseome_content.php"></fb:comments-count>
</div>

<div class="details">
  <div class="series"><a href="interesting_stuff.php">text</a></div>
  <fb:comments-count href="interesting_stuff.php"></fb:comments-count>
</div>

jsFiddle demo

我对您问题中的实际HTML进行了一处更改。 href属性的值（以及该问题的任何属性）应始终用引号括起来。

<fb:comments-count href=的 “ [PAGEURL]的” ></fb:comments-count>

Answer 2

如果您使用jquery，这非常简单：

$('.series').each(function() {
    $(this).next('fb:comments-count').href = this.href;
});

不确定jQuery选择器'fb：comment-count'是否真的有效。您可能只想向该元素添加一个类名，并在该类名上使用选择器。

Answer 3

如果您在PHP中生成此页面，那么只包含URL服务器端会更容易。在不了解您的脚本的情况下，它将类似于：

<?php $url='...'; ?>
<div class="details">
<div class="series"><a href="<?php echo $url; ?>">text</a></div>
<fb:comments-count href="<?php echo $url; ?>"></fb:comments-count>
</div>

Answer 4

不幸的是，你要做的事情不会起作用，因为FB：标签会在dom加载时被激活到Facebook。然后，这会在iframe中创建可以更改的fb元素。

但是如果你有多个链接和多个按钮，那么你应该对它们进行硬编码，但我认为你想要一个带有多个链接的fb按钮来修改它的网址。

如果是这种情况，那么您仍然无法加载dom上的所有按钮，然后显示您想要的那个

<div class="details">
    <div class="series"><a href="MyLink1.php" id="MyLink1">text</a></div>
    <div class="fb MyLink1"><fb:comments-count href=[PAGEURL]"></fb:comments-count></div>

    <div class="series"><a href="MyLink2.php" id="MyLink2">text 2</a></div>
    <div class="fb MyLink2"><fb:comments-count href=[PAGEURL]"></fb:comments-count></div>

    <div class="series"><a href="MyLink3.php" id="MyLink3">text 3</a></div>
    <div class="fb MyLink3"><fb:comments-count href=[PAGEURL]"></fb:comments-count></div>
</div>

然后隐藏所有fb框并显示您想要的那个

$(".fb").hide();
 $(".fb").eq(0).show();

    $(".details . series a").click(function(){
        $(".fb").hide();
        $("."+$(this).attr("id")).show();
    });

然后将fb按钮定位在绝对某处

的位置

.fb{
    position:absolut; top:0; left:0;
}

动态Facebook评论计数器链接

4 个答案:

jsFiddle demo