0

番号付きの別のリスト ビューに配置する必要がある XML 応答の一部があります。これが応答です

  <Note>
Cook pasta according to directions, chill in ice water, drain.¶Blanch broccoli in boiling water, chill in ice water, drain.¶Use ½ soy sauce to season the chicken, heat oil in no stick pan, brown chicken, and reduce heat and finish cooking.¶Don"t overcook! Slice chicken into 1" strips, turn and cut into ¼" pieces, place into bowl with other ingredients except dressing and soy sauce.¶Mix remainder of soy sauce into dressing and pour over pasta, chicken, and vegetables.¶Toss gently and serve immediately.¶You might like to leave the pasta, chicken, broccoli un-chilled and serve it semi-warm
 </Note>

「¶」は各手順の区切り記号です。そのloリストビューを追加するにはどうすればよいですか? 別に..私はいくつかの助けが必要ですありがとう

これは私のコードです。動作していません

$(req.responseText).find('NewDataSet').each(function(){
                 var split =  $(this).find('Note').text();
                  var lines = split.split('¶');
                    $.each(lines, function(key, line) {
                    $('#RecipeProc').append('<li><a href="#">' + line + '</a></li>');
                         $('#RecipeProc').listview('refresh');
                   });


              });
4

1 に答える 1

1

作業例: http://jsfiddle.net/Gajotres/Z7uxZ/

HTML :

<!DOCTYPE html>
<html>
    <head>
        <title>jQM Complex Demo</title>
        <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
        <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>    
    </head>
    <body>
        <div data-role="page" id="index">
            <div data-theme="a" data-role="header">
                <h3>
                    First Page
                </h3>
                <a href="#second" class="ui-btn-right">Next</a>
            </div>

            <div data-role="content">
                <ul data-role="listview" data-theme="a" id="custom-listview">

                </ul>
            </div>

            <div data-theme="a" data-role="footer" data-position="fixed">

            </div>
        </div>    
    </body>
</html>

Javascript :

$(document).on('pagebeforeshow', '#index', function(){       
    var split = 'Cook pasta according to directions, chill in ice water, drain.¶Blanch broccoli in boiling water, chill in ice water, drain.¶Use ½ soy sauce to season the chicken, heat oil in no stick pan, brown chicken, and reduce heat and finish cooking.¶Don"t overcook! Slice chicken into 1" strips, turn and cut into ¼" pieces, place into bowl with other ingredients except dressing and soy sauce.¶Mix remainder of soy sauce into dressing and pour over pasta, chicken, and vegetables.¶Toss gently and serve immediately.¶You maight like to leave the pasta, chicken, broccoli un-chilled and serve it semi-warm';

    var lines = split.split('¶');
    $.each(lines, function(key, line) {
        $('#custom-listview').append('<li><a href="#">' + line + '</a></li>');
    });
    $('#custom-listview').listview('refresh');
});

編集 ：

アプリをデバッグするには:

  1. まず、変数 split に値があることを確認してください

    var split =  $(this).find('Note').text(); 
alert(split); // or console.log(split);

  2. ポイント 1 が正しければ、文字列が正常に分割されていることを確認します。

    var lines = split.split('¶');
alert(lines.length);
于 2013-04-29T07:40:17.993 に答える