我有一个函数，用于从JSON文件中获取信息并动态显示它。我根据数组中的元素数量动态创建多个页面。当我将它应用到一个页面时它完美地工作但是当我将它应用于多个页面（我需要）时，滚动功能停止工作，没有明显的原因。我将第二页更改回原始状态，第一页再次开始工作。这是我的JS功能，如果你能告诉我发生了什么，我会很感激。
<script type="text/javascript">
$(document).on("pageinit", "#Page1", function(){
var info="";
var dpages="";
var pageno=1;
var imp= "Json/empirical.json";
$.getJSON(imp, function(data) {
$.each(data.tcontent, function(i, item) {
if(item.Name=='Skin and Soft Tissue Infections'){
var search=item.Variations;
$.each(search, function(j, subitem) {
info += '<a href="#Paged'+ pageno + ' " data-role="button" data-mini="true">'+ subitem.condition +'</a><br>';
dpages += '<div data-role="page" data-theme="a" id="Paged' + pageno + '"> <div data-role="header" data-theme="c"><a data-rel="back" data-role="button" class="ui-btn-left" data-transition="flip" data-icon="back"> Back</a> <h2>'+ subitem.condition +'</h2> </div> <div data-role="content" data-theme="c" id="Paged '+ pageno +'_Content"> <p class="infotexttitle">Likely Organisms: </p> ' + subitem.organisms + ' <p class="infotexttitle"> Antimicrobial & Dosage </p> ' + subitem.antimicrobial + ' <p class="infotexttitle"> Alternative Antimicrobial: </p> ' + subitem.alternative + ' <div data-role="collapsible" data-mini="true" data-collapsed-icon="arrow-r" data-expanded-icon="arrow-d" data-iconpos="right" data-theme="d" data-content-theme="d"> <h3> Comments: </h3> <p class="guidelinetext"> ' + subitem.comments + ' </p></div> </div> <div data-role="footer" data-theme="c"> <h2>(c) Darragh O Connor </h2></div> </div></div>';
pageno++;
});
}
$("#texts").empty().append(info).collapsibleset().trigger('create');
$.mobile.pageContainer.append(dpages);
}); }); });