0

jQueryの$.ajaxリクエスト（IDを持たない）を介して別のWebページの特定の部分を読み込もうとしています。

簡単な例...

HTMLの例を次に示します。

<div id="list">
    <ul>
        <li>Foo 6</li>
        <li>Foo 7</li>
        <li>Foo 8</li>
        <li>Foo 9</li>
        <li>Foo 10</li>
    </ul>
</div>

そして、いくつかの例JQ：

$("#more").on("click", function(event){
    $.ajax({
        url: 'foo.html',
        datatype: 'html',
        success: function (data) {
            $('#list ul').append($(data).filter('#list').html());
        }
    })
    event.preventDefault();
});

ただし、＃list内のulをターゲットにしたいのですが、フィルターを「#list ul」に変更すると、何も機能しません。それは私を夢中にさせます。この要素をターゲットにするにはどうすればよいですか？フィルタの代わりに検索を使用してみましたが、それでも何も返されません。

乾杯

4

2 に答える 2

0

filter()ターゲットセレクターがルートレベルにある場合にのみ機能します。それ以外の場合は、使用する必要がありますfind()

 $('#list ul').append($(data).find('#list ul').html());

または以下も機能しますが、効率的ではないようです

$('#list ul').append($(data).filter('#list').children('ul').html());
于 2013-01-24T12:55:55.423 に答える
0

更新されたフィドル: http://jsfiddle.net/vKUD7/1/

<div id="container">
    <div>
        <div id="list">
            <ul>
                <li>Foo 6</li>
                <li>Foo 7</li>
                <li>Foo 8</li>
                <li>Foo 9</li>
                <li>Foo 10</li>
            </ul>
        </div>
    </div>
</div>
<div id="list2">
    <ul></ul>
</div>

この簡単なコードを使用して、他のページから返されたデータをシミュレートします。

var data = $('#container').html();

$('#list2 ul').append($(data).find('#list ul').html());

//Doesn't work
//$('#list2 ul').append($(data).filter('#list').children('ul').html());

他の答えの最初の部分も正しいです。find を使用して要素の子を再帰的にトラバースする必要があります。これにより、ID で div が検索され、その div 内でのみ ul 要素を検索できるようになります。

.filter と .children を使用する 2 番目の部分は機能していないようです...

お役に立てれば！

于 2013-01-24T12:58:32.390 に答える