jquery - jQuery AJAX リクエストが XML を返す

Question

<suggestions>
<user>
<![CDATA[ Chris ]]>
</user>
<user>
<![CDATA[ Christina ]]>
</user>
</suggestions>

そしてjs部分

            $.ajax({
                type: "POST",
                url: 'index.php/Suggest/',
                dataType: 'xml',
                data: {username: username},
                success: function(data) {
                    $(data).find('suggestions').each(function(){
                        if ($(this).find('user').text()) {
                            $('#container').html('<div>' + $(this).find('user').text() + '</div>');
                        }
                    });
                },
                error: function(request, status, error) {
                    // will also occur when the user toggles a window and instantly clicks on a link, so don't alert anything
                }
            });

インサート

<div>ChrisChristina</div>

でも私はしたい

<div>Chris</div> <div>Christina</div>

Answer 1

を反復すると思いますsuggestions。代わりに、 を反復する必要がありuserます。作業コードは次のとおりです。

var response = ""+
"<suggestions>" +
"<user>" + 
"<![CDATA[ Chris ]]>" +
"</user>" + 
"<user>" + 
"<![CDATA[ Christina ]]>" + 
"</user>" + 
"</suggestions>";

// This is using the JSFiddle "echo" interface
$.post("/echo/xml/", {"xml": response}, function(data) {
    $(data).find('user').each(function(i, user){
        $("#container").append($("<div>").text($(user).text()));
    });
});​

JSFiddleでライブで見ることができます

Answer 2

すべてのユーザーを追加する場合は、append代わりに使用する必要があります。html

    $(data).find('suggestions').each(function(){
        $(this).find('user').each(function(){
            $('#container').append('<div>' + $(this).text() + '</div>');
        });
    });

Answer 3

user各要素を反復処理する必要があります。text()複数の要素に対してメソッドを使用すると、すべてのテキストが返されますが、メソッドはスペースを追加することを識別する方法がありません。

$(data).find('suggestions').each(function() {
    var $user=$(this).find('user');
      /* use length to check if user elements exist*/
     if($user.length){
          var user=$user.map(function(){
            return $(this).text();
          }).get().join(' ')

        $('#container').append('<div>' + user + '</div>');
    }
});