• 未分類
  • 0

[mobile-web] input set focus not working

在 iOS8 某些手機有 focus 設定無效的問題

但測試有發現同os  有手機些有效的 , 有些不會作用

所以針對IOS 做了 fixd 處理
只要觸發文字欄位,不做任何系統處置只做 focus

注意:如果沒有判斷iOS 處理在 android 會造成 focus 無法跳出鍵盤,但狂按很多下還是跳得出來…XDDD

以下為搭配文字框輸入滿四位會更換欄位,或點退回鍵返回原欄位範例

<form>
 <input type="text" name="f1" maxlength="4"> -
 <input type="text" name="f2" maxlength="4"> <br />
 <!-- pattern="[0-9]*" -->
 <input type="button" value="ok">
</form></pre>
<pre>

var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
if(iOS){
 $("body").on("touchstart", "textarea, input", function(e)
{ e.preventDefault(); $(e.target).focus(); }
);
}

//輸入滿四個文字時跳下一個輸入框
$("input[name=f1]").bind("input", function (e) {
 if($(this).val().length >= 4){
 $("input[name=f2]").focus();
 trace("set f2 focus")

 }
 });

//按下返回鍵 且沒內容時跳回第一個輸入框
$("input[name=f2]").bind("keydown", function (e) {

 if( e.which == 8) //返回鍵keyCode
 {
 if($(this).val().length == 0){
 $("input[name=f1]").focus();
 }
 }
 })</pre>
<pre>

Comments

comments

您可能也會喜歡…

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料