Jquery Mobile问题与长选择多选项和数据本机菜单=“假” [英] Jquery Mobile issue with long select multiple option and data-native-menu="false"

问题描述

我正在使用jquery 1.9.1 js和jquery mobile 1.3.2 css和js。

我有一个带有长选择框的页面，20个项目。
当我打开选择框时，选择一些项目并再次关闭它，我最终会出现一个空白页。

有没有人有这个问题？ >

使用jquery mobile 1.3.1，当您第二次打开它时，选择框为空，但这并不改善。

编辑：

我的页面上的代码：

 code>< div data-role =pageid =new_agent_editdata-theme =dqs => 
< div data-role =headerdata-theme =b> 
 
< h1>新代理编辑< / h1> 
< / div> 
 
< div id =new_agent_editContentdata-role =content> 
 
< div> 
< h2 style =display：inline>代理#Test代理< / h2>< br /> 
< / div> 
 
< div> 
< form id =frmAgentNewEditname =frmAgentNewEdit> 
 
< div data-role =fieldcontain> 
< label for =new_agent_editsubscribersclass =select>发布到：< / label> 
< select name =subscribersid =new_agent_editsubscribersdata-native-menu =falsemultiple =multiple> 
< option data-placeholder =true>选择代理...< / option> 
< option value =1>＃1 SMS消息（非活动）< / option> 
< option value =2>＃2天气更新（非活动）< / option> 
< option value =3>＃3库存更新（活动）< / option> 
< option value =4>＃4电子邮件通知（非活动）< / option> 
< option value =5>＃5摘要电子邮件（非活动）< / option> 
< option value =6>＃6 Word Cloud（inactive）< / option> 
< option value =7>＃7时间序列（活动）< / option> 
< option value =8>＃8 Google新闻情绪分析（活动）< / option> 
< option value =9>＃9 Google Nieuws（active）< / option> 
< option value =10>＃10 Twitter（active）< / option> 
< option value =11>＃11时间序列（非活动）< / option> 
< option value =12>＃12时间序列（非活动）< / option> 
< option value =13>＃13 twitterstream：Sentiment Analysis（active）< / option> 
< option value =14>＃14天气（非活动）< / option> 
< option value =15>＃15读取电子邮件（非活动）< / option> 
< option value =16>＃16库存（非活动）< / option> 
< option value =17>＃17 it-ebooks：Last Update eBooks（inactive）< / option> 
< option value =18>＃18 Dilbert（inactive）< / option> 
< option value =19>＃19 Marktplaats aanbiedingen（inactive）< / option> 
< / select> 
< / div> 
 
< / form> 
< / div> 
 
< / div> 
< / div> 
  

这里有两个截图：

打开选择框
关闭选择框

解决方案

自己

弹出窗口是从具有pagebeforeshow事件的页面打开的。
此事件包含页面的初始化代码。
每次关闭弹出窗口，此事件将再次触发，从而导致初始化代码中断。

通过使初始化代码的执行为条件I解决问题：

  $（'＃edit_agent'）。on（'pagebeforeshow'，function（event，data）{
 
 if（data.prevPage.attr（'id'）！=='new_agent_editsubscribers-dialog'）{
 
 //初始化代码
 ... 
 ... 
} 
}）; 
  

I am using the jquery 1.9.1 js and jquery mobile 1.3.2 css and js.

I have a page with a long selectbox, 20 items. When I open the selectbox, choose some items and close it again, I end up with a blank page.

Has anyone had this problem?

With jquery mobile 1.3.1 there was the problem that the selectbox was empty when you opened it for the second time, but this is no improvement.

EDIT:

This the code on my page:

<div data-role="page" id="new_agent_edit" data-theme="d" qs="">
    <div data-role="header" data-theme="b">

        <h1>New Agent Edit</h1>
    </div>

    <div id="new_agent_editContent" data-role="content">

          <div>
            <h2 style="display:inline">Agent #Test Agent</h2><br/>
          </div>

          <div>
          <form id="frmAgentNewEdit" name="frmAgentNewEdit">

          <div data-role="fieldcontain">
              <label for="new_agent_editsubscribers" class="select">Publishes To:</label>
              <select name="subscribers" id="new_agent_editsubscribers" data-native-menu="false" multiple="multiple">
                 <option data-placeholder="true">Choose Agents...</option>
                 <option value="1">#1 SMS Message (inactive)</option>
                 <option value="2">#2 Weather Update (inactive)</option>
                 <option value="3">#3 Stock Update (active)</option>
                 <option value="4">#4 Email Notification (inactive)</option>
                 <option value="5">#5 Digest Email (inactive)</option>
                 <option value="6">#6 Word Cloud (inactive)</option>
                 <option value="7">#7 Time Series (active)</option>
                 <option value="8">#8 Google News Sentiment Analysis (active)</option>
                 <option value="9">#9 Google Nieuws (active)</option>
                 <option value="10">#10 Twitter (active)</option>
                 <option value="11">#11 Time Series (inactive)</option>
                 <option value="12">#12 Time Series (inactive)</option>
                 <option value="13">#13 twitterstream: Sentiment Analysis (active)</option>
                 <option value="14">#14 Weather (inactive)</option>
                 <option value="15">#15 Read Email (inactive)</option>
                 <option value="16">#16 Stock (inactive)</option>
                 <option value="17">#17 it-ebooks: Last Update eBooks (inactive)</option>
                 <option value="18">#18 Dilbert (inactive)</option>
                 <option value="19">#19 Marktplaats aanbiedingen (inactive)</option>  
              </select>
          </div>

          </form>
          </div>

    </div>
</div>

And here are 2 screenshots:

Open selectbox Close selectbox

解决方案

Solved it myself

The popup is opened from a page which has a pagebeforeshow event. This event contains the initialisation code for the page. Every time the popup is closed this event is triggered again and thereby the initialisation code, which causes disruption.

By making the execution of the initialisation code conditional I solved the issue:

$('#edit_agent').on('pagebeforeshow', function(event, data) {

    if ( data.prevPage.attr('id') !== 'new_agent_editsubscribers-dialog') {

        // initialisation code
        ...
        ...
    }
});

这篇关于Jquery Mobile问题与长选择多选项和数据本机菜单=“假”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！