Jquery mobile 在jQuery mobile中，弹出窗口不能一次完全显示？

我有一个包含列表视图的弹出窗口，并将其动态添加到弹出窗口中。我的问题是，当我按下“显示弹出窗口”按钮时，它会先显示图像，然后继续显示带有列表的弹出窗口

我怎样才能解决这个问题？为什么弹出窗口没有立即完全显示

请帮帮我

这是我的代码：

<div data-role="page"  id="MainPage">
      <div data-role="header" data-theme="b">
         Main Page
      </div>
     <div data-role="content"  >
     <a href="#mypop" data-rel="popup"  id="Btn1"  data-role="button" data-inline="true" >Show POPUP    </a>
     </div>

   <div data-role="popup"  id="mypop" data-position-to="window"  data-corners="false"   data-overlay-theme="a" data-dismissible="false"  >

     <div data-role="header" data-theme="b" >

     <a href=""   id="ClosePOPUP"  data-role="button" class="ui-btn-left" data-inline="true"    >Cancel      </a>
         <div style="text-align:center;float:center;padding-top:11px;" ><font  size="6px"             color="white"   >pop</font></div>
      </div>

       <div  id="scrollDiv" class="content"  data-role="content"  style="background-color: white;overflow-y:scroll; ">
                <ul  id="PList"  data-role="listview" style="margin: 0 !important;">

                </ul>
                </div>
             </div>
</div>

主页
流行音乐

java脚本：

 $('#MainPage').on( 'pageshow',function(event){    

      for(var i=0;i<100;i++)
      {
          $('#PList').append( '<li><img src="images/img1.png"  /> '+ 
                           ' element</li> '); 

       }
       $('#PList').listview('refresh');

    }); 


   $(document.body).on('click','#ClosePOPUP', function(){ 

    $('#mypop').popup('close');

 });

$（'MainPage'）。在（'pageshow'，函数（事件）{
对于（var i=0；i弹出后出现的项目是打开的
popupafteropen
事件。感谢您的帮助，但问题仍然出现在移动设备上