javascript - pageshow jquery mobile时激活一个功能

Question

我在 jquery pageshow 函数中有一个函数，只有在某个页面 (id) 上时才应该被激活。但出于某种原因，它不运行该脚本。这些页面是带有 id 的动态页面。

这是我的代码示例

$(document).on('pageshow', '#fragment-1', function() {    
        $.mobile.activePage.find("div [data-role=tabs] ul li:first-child a").click();

        createCheckboxes('#fragment-2')

});

function createCheckboxes(into){

        var players_names = playerCal("ars", 7, 5);
         $("#createBtn").remove();
         $(into).append('<fieldset class="cbFieldSet" data-role="controlgroup">');
         var length = players_names[0].length;
         $(".cbFieldSet").append("<ul data-role='listview' data-inset='true' data-theme='d' data-divider-theme='e' data-count-theme='b'><li data-role='list-divider'><span>Select players in the next line up2</span></li></li>");
         for(var i=0;i<length;i++){
            $(".cbFieldSet").append('<li><input type="checkbox" name="cb-'+i+'" id="cb-'+i+'" value="'+players_names[0][i]+'"/><label for="cb-'+i+'">'+players_names[0][i]+'</label></li>');
         }

          $(".cbFieldSet").append("</ul>");

         $(into).trigger("create");
         $("#showBtn").css("visibility","visible");
         console.log(players_names);
        }

我的动态页面示例，有效

+"<div id='fragment-1'>"
      + "<form>"
      + "<fieldset data-role='controlgroup' class = 'content'>"
      + "</fieldset>"
      + "</form>"
      + "</div>"
      + "<div id='fragment-2'>"
     + "<form>"
      + "<fieldset data-role='controlgroup' class = 'content'>"
      + "</fieldset>"
      + "</form>"
      + "</div></div></div>");

Answer 1

我喜欢有人提出清晰易读的问题。

您的代码中有一个错误，包含您页面的 div 不是正确形成的 jQUery Mobile 页面。

改变这个:

<div id='fragment-1'>

对此:

<div id='fragment-1' data-role="page">

页面事件仅适用于具有属性 data-role="page" 的 div 容器。

更新:

根据您/我之前的示例制作的工作示例:http://jsfiddle.net/Gajotres/vds2U/55/