1

我想在系列类中找到 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>
4

4 回答 4

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 演示

我根据您的问题对实际 HTML 进行了一项更改。href财产（以及与此相关的任何财产）的价值应始终用引号引起来。

<fb:comments-count href=" [PAGEURL]"></fb:comments-count>

于 2012-07-25T21:23:45.650 回答
0

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

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

不确定 jQuery 选择器 'fb:comment-count' 是否真的有效。您可能希望简单地向该元素添加一个类名并在该类名上使用选择器。

于 2012-07-24T17:45:33.600 回答
0

如果您在 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>
于 2012-07-24T17:53:03.857 回答
0

不幸的是，您尝试做的事情不会像 FB 一样工作：标签会在 dom 加载时发送到 Facebook。然后，这会在您可以更改的 iframe 中创建 fb 元素。

但是，如果您有多个链接和多个按钮，那么您应该将它们硬编码，但我假设您想要一个带有多个链接的 fb 按钮，这些链接将修改其 url。

如果是这种情况，那么你坚持加载 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;
}
于 2012-07-25T17:32:57.170 回答