0

jQueryを使用して、URLのリストから特定のコンテナに配列内の各URLのコンテンツを追加することは可能ですか?

このような:

<li class="contacts"><a href="index.php#contact1">Contact 1</a>
<li class="contacts"><a href="index.php#contact2">Contact 2</a>
<li class="contacts"><a href="index.php#contact3">Contact 3</a>
<li class="contacts"><a href="index.php#contact4">Contact 4</a>

jQuery を使用して URL の配列を取得する方法を知っています。

$(document).ready(function() {
    var allLinks = $('li.contacts a').map(function(i,el) { return $(el).attr('href');     });
    console.log($(allLinks));
});

わかりました。allLinks 変数に URL の配列があります。たとえば、この各 URL の #content 要素のコンテンツを .get() 関数で追加したいと考えています。

配列の最初の URL から最後の URL までループし、そのコンテンツを現在のページに追加する方法は? 基本的には次のように終了する必要があります。

<div id="currentpage">
//#content of URL1
//#content of URL2
//#content of URL3
//#content of URL4
</div>

URL のリストは動的に生成されます (これは問題ではありません)。

私はこれを試しました:

$(document).ready(function() {
    var allLinks = $('li.contacts a').map(function(i,el) { return $(el).attr('href'); });
    console.log($(allLinks));

  var curr  = 0;
        if (curr++ > allLinks.length) curr = 0;

        $.get(allLinks[curr],function(data){
        var myContent = $(data).find('#content').children();
            jQuery('#wrapper').append(myContent);
   });
});

しかし、成功せずに。どんな手掛かり?

4

1 に答える 1

0

更新された回答:(クリックされたhrefをdivにロード)

$('.contacts a').click(function() {
  var url= $(this).attr('href');
  $('#currentpage').html('loading...');
  $.ajax({
     url: url
  }).success(function(data) {
     $('#currentpage').html(data);
  });       
  return false;
});
//JSBin http://jsbin.com/ucobuv/3/edit
//No need for the allLinks variable here

古い回答: (すべてのリンクを読み込む)

(function getContent(i) {
    $.ajax({
        url: allLinks[i++]
    }).success(function(data) {
        $('#currentpage').append(data);
        if(allLinks[i]) getContent(i);
    });
})(0);
//JSBin http://jsbin.com/ucobuv/1/edit
于 2013-02-05T13:01:19.280 に答える