1

Facebookのいいねの数をDivタグに挿入する関数を作成しようとしています。これまでのところ、「entry」という別のDivタグ内にあるDivタグからURLを取得し、.getJSON（）メソッドで各エントリのFacebookいいねの数を取得できるスクリプトがありますが、 Facebook Likesの取得された各値を取得して、各エントリのDivタグに挿入しないでください。各FacebookLike値を警告する場所にコードを簡略化したことに注意してください。これは私がこれまでに持っているものです：

<div class="entry">
  <div class="fburl">https://graph.facebook.com/zombies</div>
  <div class="facebook-likes"></div>
</div> 
<div class="entry">
  <div class="fburl">https://graph.facebook.com/starwars</div>
  <div class="facebook-likes"></div>
</div>

そしてこれが私のjQueryです：

$(document).ready(function(){
$(".entry").each(function() {
    var fbURL = $(this).find(".fburl").html();
    $.getJSON(fbURL, function(fbData) {
        var fbArr = fbData['likes'];
        alert(fbArr);
    });
});
});

だから私がやろうとしているのは、各エントリを繰り返し処理し、そのエントリのOpen Graph URLを取得し、Likes値を取得してから、適切なDivタグに挿入することです。これにより、コードは次のようにレンダリングされます。

<div class="entry">
 <div class="fburl">https://graph.facebook.com/zombies</div>
 <div class="facebook-likes">2,586 Likes</div>
</div> 
 <div class="entry">
  <div class="fburl">https://graph.facebook.com/starwars</div>
  <div class="facebook-likes">8,905,721 Likes</div>
</div>

</ p>

4

2 に答える 2

1 
$(document).ready(function() {
    $('.entry').each(function() {
        var $this = $(this),
            fbURL = $this.children('.fburl').html();
        $.getJSON(fbURL, function(fbData) {
            $this.children('.facebook-likes').html(fbData['likes'] + ' Likes')
        });
    });
});

参照： http ：//api.jquery.com/children

デモ： http： //jsfiddle.net/9EALz/2/

注：使用すると、DOMトラバーサルが単一レベルに制限されるためchildren()、使用するよりもわずかに効率的になります（ http://jsperf.com/find-vs-children/13）。経由でjQueryオブジェクトをキャッシュすることも、不要なセレクターの解釈を防ぐため、わずかに効率的です（http://jsperf.com/jquery-cache-vs-no-chace）。find()$(this)var $this = $(this)

于 2012-10-15T00:41:44.670 に答える
1

あなたはこれが欲しいかもしれません

$(document).ready(function(){
    $(".entry").each(function() {
        var entry=$(this), fbURL=$(".fburl", entry).html(),
        el=$('.facebook-likes', entry);
        $.getJSON(fbURL, function(fbData) {
           el.html(numberWithCommas(fbData['likes'])+" Likes");
        });
    });
});​

ここから千の区切り関数

function numberWithCommas(x) {
    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}

デモ。

アップデート：

または、これを（data-attributeを使用して）追加のdivなしで使用することもできます。fburl

<div class="entry">
    <div data-fburl="https://graph.facebook.com/zombies" class="facebook-likes"></div>
</div>

JS

$(".entry").each(function() {
    var entry=$(this), fbURL = $(".facebook-likes", entry).attr('data-fburl'),
    el=$('.facebook-likes', entry);
    $.getJSON(fbURL, function(fbData) {
        el.html(numberWithCommas(fbData['likes'])+" Likes");
    });
});
于 2012-10-15T00:43:13.957 に答える