0

如何将此作为段落附加，每行有一个自动编号。下面的示例在列表视图中。请参阅链接。它的工作。

工作演示，但在列表视图中

我的 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>

js代码

$(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 might 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');
});
4

1 回答 1

1

只需声明一个变量并为您附加的每个项目增加它。

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

http://jsfiddle.net/Z7uxZ/2/

于 2013-04-30T06:19:14.897 回答