搜索清除按鈕不會出現在iOS中

我有一個應用程序，它可以對郵政編碼進行一些搜索，而且大部分它都可以正常工作。不過，我注意到在字段右側出現的清晰圖標並未出現在某些瀏覽器中。搜索清除按鈕不會出現在iOS中

所以我創建了一個基本的HTML標記來測試一些瀏覽器。這沒有任何附帶的CSS樣式表。

<input type="search" />

在iOS 7 Safari和Chrome中不顯示。在Mac OS X上，Safari 7.0.1和Chrome 31.0.1650.63的功能非常完美。在Firefox 26 for Mac下，這不會出現。

我想要它的主要原因是因爲Web應用程序將主要在移動平臺上運行，並且在閃存中刪除郵政編碼將非常方便持續使用。

我試過的另一種策略是選擇整個文本，一旦該領域焦點。

<input id="orig" type="search" value="" placeholder="Origin" onclick="this.select()">

這適用於Mac/Firefox/Firefox/Safari/Chrome，但不適用於iOS。

只要我能夠快速擺脫搜索字段中的舊文本，我並不介意上述哪些作品。有沒有一種通用標記可以用於所有瀏覽器？

來源

2013-12-23 user2280642

我已經解決了我的查詢使用jQuery Mobile的下面的代碼：

<!DOCTYPE html> 
<html> 
<head> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css"> 
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script> 
</head> 
<body> 

<div data-role="page" id="pageone"> 
    <div data-role="header"> 
    <h1>Insert Page Title Here</h1> 
    </div> 

    <div data-role="content"> 
    <label for="search-enhanced">Search:</label> 
      <div class="ui-input-search ui-body-inherit ui-corner-all ui-shadow-inset ui-input-has-clear"> 
<input type="text" data-type="search" data-enhanced="true" name="search-enhanced" id="search-enhanced" value=""> 

      </div> 
    </div> 

    <div data-role="footer"> 
    <h1>Insert Footer Text Here</h1> 
    </div> 
</div> 

</body> 
</html>

我希望這有助於具有相同問題的人。

來源

2013-12-24 13:31:43 user2280642

搜索清除按鈕不會出現在iOS中

回答

相關問題