1

使用 jQuery Mobile，下面的代码可以工作，但是当我单击一个菜单项然后单击“返回”时，我的所有菜单项都已重复/附加等。

 $.each(siteData["pages"], function(i,v) {


        $.mobile.activePage.find('[data-role=content]').append('' +
            '<a href="#' +  v["id"] +
            '" data-role="button">' + v["name"] +
            '</a>').trigger('create');



        var newPage = $("<div data-role='page' id='" + v["id"] +
            "'><div data-role=header><a data-iconpos='left' data-icon='back' href='#' data-role='button' " +
            "data-rel='back'>Back</a>" +
            "<h1>Dynamic Page</h1>" +
            "</div>" +
            "<div data-role=content>Stuff here</div>" +
            "</div>");


        // Append the new page info pageContainer
        newPage.appendTo($.mobile.pageContainer);



    });

我怎样才能阻止这种行为？

4

1 回答 1

2

我将为您提供上一个问题的解决方案，它会更容易理解

看看工作示例：http: //jsfiddle.net/Gajotres/3kPTf/

基本上在添加内容之前，您需要检查该常量是否已经存在。

在您的情况下，每次添加新按钮/页面时，检查该按钮/页面是否已经存在，如下所示：

if(!$('#second').length){
     // In this case this code block will execute if button with an id second don't exist
}

这是一个代码示例：

$(document).on('pagebeforeshow', '#index', function(){  
    if(!$('#second').length){
        $.mobile.activePage.find('[data-role=content]').append('<a href="#second" data-role="button">Second</a>').trigger('create');

        var newPage = $("<div data-role='page' id='second'><div data-role=header><a data-iconpos='left' data-icon='back' href='#' data-role='button' data-rel='back'>Back</a>" +
                        "<h1>Dynamic Page</h1>" +
                        "</div>" +
                        "<div data-role=content>Stuff here</div>" +
                        "</div>");

        // Append the new page info pageContainer
        newPage.appendTo($.mobile.pageContainer);        
    }
});
于 2013-03-31T22:48:07.040 回答