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 に 1 つの変更を加えました。hrefプロパティ (およびそのプロパティのすべてのプロパティ) の値は、常に引用符で囲む必要があります。

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

于 2012-07-25T21:23:45.650 に答える
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 要素が作成されます。

ただし、複数のリンクと複数のボタンがある場合は、それらをハードコーディングする必要がありますが、URL を変更する複数のリンクを持つ 1 つの 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;
}
于 2012-07-25T17:32:57.170 に答える
0

jQuery を使用する場合、これは非常に簡単です。

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

jQuery セレクター 'fb:comment-count' が実際に機能するかどうかは不明です。その要素にクラス名を単純に追加し、そのクラス名でセレクターを使用することもできます。

于 2012-07-24T17:45:33.600 に答える