如何讓輸入鍵在Android/jQuery手機上工作

所以，首先讓我開始說我是jQuery mobile /任何類型的移動設備的新手。不過，我正在使用使用Phonegap的Icenium構建應用程序。我的應用程序運行得非常好，但有兩件大事我找不到。如何讓輸入鍵在Android/jQuery手機上工作

如何與輸入按鈕進行交互，即點擊我的按鈕點擊處理程序。
如何強調用戶點擊文本框時的所有文本。所以他們不必使用鍵盤後退鍵。

我試過用谷歌搜索各種術語，但似乎無法找到任何東西。問題是你把jQuery放在任何地方，結果都是瘋了。

這是我的HTML。

<body> 
    <div data-role="page" id="home"> 
    <div data-role="header"> 
     <div id='SearchInput'> 
     <label for="txtSearchTerm">Search For a Session</label> 
     <input type="text" id="txtSearchTerm" value="" /> 
     <input type="button" id="btnFilterSessions" value="Filter Sessions" /> 
     <span id="sessionCount"></span> 
     </div> 
    </div> 
    <div data-role="content"> 
     <ul id="sessionsList"></ul> 
    </div> 
    <div data-role="footer" data-position="fixed" data-id="oneFooter"> 
     <span class="footerText">@r0k3t</span> 
    </div> 
    </div>

這是我完整的JS。

document.addEventListener("deviceready", onDeviceReady, false); 
var codeMashApp = {}; 
function listSessions(sessions) { 
    $("#sessionsList").empty(); 
    sessions.each(function() { 
    var title = $(this).find('Title').text(); 
    var uri = $(this).find('URI').text(); 
    $("#sessionsList").append("<li class='sessionTitle'><a href='#detailsPage' id='" + uri + "' data-transition='slide'>" + title + "</a></li>"); 
    }); 
    $("#sessionCount").text("Number of sessions: " + sessions.length); 
} 
function onDeviceReady() { 
    $.ajax({ 
    type: "GET", 
    url: "http://rest.codemash.org/api/sessions", 
    data: "{}", 
    success: function(d) { 
     codeMashApp.rootElement = d.documentElement; 
     var sessions = $(codeMashApp.rootElement).find("Session"); 
     listSessions(sessions); 
    } 
    }); 
    $("#btnFilterSessions").click(searchSessions); 
} 
function searchSessions() { 
    var searchTerm = $("#txtSearchTerm").val(); 
    if (searchTerm) { 
    var sessions = $(codeMashApp.rootElement).find("Title:contains(" + searchTerm + ")").parent(); 
    listSessions(sessions); 
    } else { 
    reloadAllSessions() 
    } 
} 
function reloadAllSessions() { 
    var sessions = $(codeMashApp.rootElement).find("Session"); 
    listSessions(sessions); 
}

來源

2012-11-26 Kenn

你需要讓你的頁面看起來更像是一個標準的HTML表單，這樣瀏覽器將應用標準形式的行爲 - 把表單標籤裏面的文本框和按鈕，並使用input type="submit"代替通用按鈕的。

對於選擇，請參閱 Select all contents of textbox when it receives focus (JavaScript or jQuery)

來源

2012-11-26 04:10:06

雖然這確實工作，我發現最好的答案是簡單地連接這樣的keyup事件$（「＃sessionsSearch」）。keyup（searchSessions） - 謝謝。 – Kenn

有沒有在移動Enter鍵。但是，當您點擊文本框時，鍵盤將彈出。在鍵盤上有「Go」按鈕。當你按下它時，會出現按下Enter鍵的ascii 13按鍵事件。

只需正常編寫程序並捕獲正常輸入的按鍵事件即可。在PC瀏覽器中，當用戶按下Enter鍵時，它將激活事件，但是在移動設備中，如果用戶按下「Go」按鈕，事件將被觸發。

這是我爲我的backbonejs應用程序做的。我爲所有文本字段創建了一個全部按Enter鍵，並且讓我說我希望全名的文本字段在按下回車鍵時更新數據庫中的值，以便可以僅通過AJAX更新該字段，而不必按提交按鈕：

$(document).on('keypress', 'input', function(event) { 
    var keycode = event.keyCode || event.which; 
    if(keycode == '13') { 
     //alert('You pressed a "enter" key in somewhere'); 

     alert("DEBUG: ENTER KEY PRESSED!"); 
     var element = event.currentTarget; 
     var id = $(element).attr("id"); 

     if (id == "fullname") { 
      $(event.currentTarget).trigger('enter'); 
      var text = $(event.currentTarget).val(); 
      localStorage.setItem("memberprofileupdatetype", "fullname"); 
      localStorage.setItem("memberprofilenameupdate", text);    
      event.preventDefault(); 
     } 
    } 
});

驗證碼：

$(event.currentTarget).trigger('enter');

將觸發我的骨幹視圖的輸入按鍵事件，所以我這樣做是爲了執行更新：

events: { 
    'enter': 'processUpdate' 
}, 

processUpdate: function() { 
    var updatetype = localStorage.getItem("memberprofileupdatetype"); 
    if (updatetype == "fullname") { 
     var newname = localStorage.getItem("memberprofilenameupdate"); 
     localStorage.removeItem("memberprofileupdatetype"); 
     localStorage.removeItem("memberprofilenameupdate"); 

     alert("New name - " + newname); 
     //do AJAX update here for the newname 
    } 
}

這有點像一個黑客，但沒有什麼可以做輸入鍵只有這樣的方式可以完成

來源

2016-10-20 12:07:08

如何讓輸入鍵在Android/jQuery手機上工作

回答

相關問題