選擇框被觸摸時顯示兩次的選項

這是一個用cordova製作的android應用程序。該表格有多個選擇框。當點擊選擇框時，選項以原生Android風格顯示，但閃爍。當您選擇選項時，選項將消失，並且選項框上的文本不會更新。沒有被選中。它適用於第二次嘗試。選擇框被觸摸時顯示兩次的選項

每隔一秒嘗試從選擇框中選擇選項都按預期工作。有趣的是，它不一定是相同的選擇框。在任何選擇框上的每次嘗試都允許選擇該選項。

使用jquery mobile 1.4.5和jquery 2.2.3。它工作正常使用jQuery移動1.3.2

EDIT1

的Android 6.0.1

當加載頁面時，每個選擇框的功能運行填充選項：

其中被定義選擇框

function populateLocationOptions() { 
    $("#addLocation option").each(function() { 
    if ($(this).val() != 'Option') { 
     $(this).remove(); 
    } 
    }); 

    var locations = getLocationArray(); 

    for (var i = 0; i < locations.length; i++) { 
    sLocationOption = "<option value=\"" + locations[i].id + "\">" + locations[i].name + "</option>"; 
    $("#addLocation").append(sLocationOption);  
    } 
    $("#addLocation").selectmenu('refresh', true); 
}

HTML部分：

<label for="addLocation" class="select"></label> 
<select name="Location" id="addLocation" data-theme="c" > 
    <option value="Option" data-i18n="addpage.location">Select Location</option> 
</select>

EDIT2適當採用Android 5.1.1

EDIT3

小例子，重現於Android 6.0.1和6.0.0科爾多瓦問題

作品。這是index.html從cordova create

<!DOCTYPE html> 
<html> 
<head> 
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *"> 
<meta name="format-detection" content="telephone=no"> 
<meta name="msapplication-tap-highlight" content="no"> 
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> 
<link rel="stylesheet" type="text/css" href="css/index.css"> 
<link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.4.5.min.css"/> 
<script src="js/jquery/jquery-2.2.3.min.js"></script> 
<script type="text/javascript" charset="utf-8" src="js/jquery/jquery.mobile-1.4.5.min.js"></script> 

<title>Hello World</title> 
</head> 
<body> 
<div data-role="page" id="add"> 
    <div data-role="header"> 
    <h1 id="addPageHeader" data-i18n="addpage.header">Flicker example</h1> 
    </div> 
    <div data-role="content"> 
    <select name="Time" id="selectTime" data-theme="c"> 
     <option value="Option">city</option> 
     <option value="Option">Paris</option> 
     <option value="Option">New york</option> 
     <option value="Option">London</option> 
     <option value="Option">Madrid</option> 
    </select> 
    </div> 
    <div data-role="footer" data-position="fixed" data-tap-toggle="false" data-id="footer"> 
    <div data-role="navbar"> 
     <ul> 
     <li><a href="#diary" data-transition="none" data-icon="bars">List</a></li> 
     <li><a href="#add" data-transition="none" data-icon="plus">Add</a></li> 
     <li><a href="#settings" data-transition="none" data-icon="gear">Settings</a></li> 
     </ul> 
    </div> 
    </div> 
</div> 
<script type="text/javascript" src="cordova.js"></script> 
<script type="text/javascript" src="js/index.js"></script> 
</body> 
</html>

由香草鍋爐板出乎意料的是，當data-position="fixed"屬性從footer DIV刪除問題消失。

來源

2016-04-14 pmitoraj

請分享一些代碼，正在使用的android版本和其他您認爲相關的細節。 – LoreV

我沒有設法使用data-position="fixed"解決這個問題。我刪除了該屬性，並使用自定義CSS來實現相同的效果。這是一個在jquery mobile支持data-position屬性之前使用的調整解決方案。下面列出的CSS文件在jquery mobile css之後加載。

body, 
.ui-page { 
     min-height: 100% !important; 
      height: auto !important; 
     } 
.ui-content 
{ 
    margin-bottom: 56px; /* footer size */ 
} 

.ui-footer { 
    position: fixed; 
    bottom: 0; 
    width: 100%; 
}

我的直覺是，這是jquery mobile無法正常使用Android 6.x的webview。

來源

2016-04-24 18:25:53 pmitoraj

我在android 5.0.1上測試時遇到這個問題。

在大多數情況下把這個文件上準備好解決了這個問題：

$("select").on('vmousedown', function(e) { $(this).focus().click(); });

我發現這個問題仍然存在飄飛，有時如果你非常迅速關閉和打開選擇窗口。

來源

2016-05-10 07:09:14 Danbardo

選擇框被觸摸時顯示兩次的選項

回答

相關問題