使用jQuery在焦點上選擇文本不工作在iPhone iPad瀏覽器

我們正在爲移動瀏覽器開發Web應用程序，我們希望任何輸入框的文本在輸入框獲得焦點時都會被選中。以下答案解決了Desktop Chrome/Safari瀏覽器的問題。下面的解決方案在Android瀏覽器工作正常，但不能在iPhone/iPad的瀏覽器，任何解決方案..使用jQuery在焦點上選擇文本不工作在iPhone iPad瀏覽器

$("#souper_fancy").focus(function() { $(this).select() }); 

$("#souper_fancy").mouseup(function(e){ 
     e.preventDefault(); 
});

參考： -

Selecting text on focus using jQuery not working in Safari and Chrome

來源

2012-03-29 Sutikshan Dubey

嘗試http://stackoverflow.com/questions/3272089/programmatically-selecting-text-in-an-input-field-on-ios- devices-mobile-safari – robocat 2012-07-11 07:29:35

是的。感謝Robcat，它的工作解決方案在這裏找到 - http://stackoverflow.com/questions/3272089/programmatically-selecting-text-in-an-input-field-on-ios-devices-mobile-safari – 2012-07-12 10:25:45

在這裏找到答案不知道如何標記爲重複的問題。 Programmatically selecting text in an input field on iOS devices (mobile Safari)

我修復這個樣子的： -

<script type="text/javascript"> 
      $('div,data-role=page').live('pageshow', function (event) { 
       jQuery.validator.unobtrusive.parse(".ui-page-active form"); 
       $("input[type='text'], textarea, input[type='password'], input[type='number']").live('mouseup', function (e) { e.preventDefault(); }); 
       $("input[type='text'], textarea, input[type='password'], input[type='number']").live('focus', function() {this.setSelectionRange(0, 9999); });    
      });  
    </script>

來源

2012-07-12 10:26:48

也許試試這個：

vmouseup
用於處理touchend或mouseup事件的規範化事件
個

http://jquerymobile.com/demos/1.1.0-rc.1/docs/api/events.html

JS：

$("#souper_fancy").focus(function() { 
    $(this).select(); 
}); 

$("#souper_fancy").vmouseup(function(e){ 
    e.preventDefault(); 
});

來源

2012-03-29 13:05:54

它沒有工作:( – 2012-04-17 05:35:11

-1

這一個爲我工作。

 $("input[type='text'],select,textarea").focus(function() { 
      $(this).addClass('text-focus'); 
     }); 

     $("input[type='text'],select,textarea").blur(function() { 
      $(this).removeClass('text-focus'); 
     }); 

     .text-focus 
     { 
     border: 1px solid #ea9a00; 
     }

來源

2012-03-29 20:29:33 Ram

您可以使用document.execCommand('selectAll');。但是，如果用戶滾動頁面，則會顯示覆制/粘貼菜單。

這是我用：

function trySelect(el, evenInactive, select_ios) { 
    var select = function() { 
     try { 
      if (mojo.isTouch && select_ios && core.iosDevice && mojo.isInput(el) && document.execCommand) { 
       document.execCommand('selectAll'); 
      } else { 
       el.select(); 
      } 
     } catch (e) { 
     } 
    }; 
    if (el && el.select && !el.disabled && (!el.readOnly || el.selectReadOnly) && mojo.isInput(el)) { 
     if (evenInactive || mojo.activeElement() === el) { 
      if (mojo.isTouch && core.webkitVer) { // http://code.google.com/p/chromium/issues/detail?id=32865 
       setTimeout(select, 0); 
      } else { 
       select(); 
      } 
     } 
    } 
}

引用一些內部功能：

mojo.isTouch - 真實的觸摸設備
core.iosDevice - 真正的iOS設備
mojo.isInput - 測試輸入元素
mojo.activeElement（） - document.activeElemen t

編輯：document.execCommand('selectAll');不應該使用和el.setSelectionRange(0, el.value.length);改爲使用。這似乎在iOS5上正常工作......它可能無法在iOS4上工作（我沒有iOS4設備進行測試）。

來源

2012-05-08 03:58:14 robocat

使用jQuery在焦點上選擇文本不工作在iPhone iPad瀏覽器

回答

相關問題