以编程方式在iOS设备上的input字段中select文本(移动Safari)

如何以编程方式selectiOS设备上input字段的文本,例如运行移动Safari的iPhone,iPad?

通常,在<input ... />元素上调用.select()函数就足够了,但这在这些设备上不起作用。 光标停留在现有条目的末尾,不做任何select。

看到这个小提琴 :(在input框中input一些文本,然后点击“select文本”)

它是在我的iPod(第五代iOS6.0.1)的input框中select文本,打开键盘,还显示剪切/复制/build议…菜单

使用普通的JavaScript。 没有尝试与jQuery

 document.getElementById("p1").selectionStart = 0 document.getElementById("p1").selectionEnd = 999 

请注意,数字999只是一个示例。 您应该将这些数字设置为您要select的字符数。

更新:

  • iPod5 – iOS6.0.1 – 工作正常。
  • iPad1 – iOS5.1.1 – 仅select文本。 点击一次select打开剪切/复制菜单
  • iPad2 – iOS4.3.3 – 仅select文本。 点击一次select打开剪切/复制菜单

对于最后两个,您可以通过触发input元素上的单击事件来进行实验

更新: (07-10-2013)

  • iPod5 – iOS7.0.2 – 在链接中使用小提琴:在input框中看不到input的文字。 按selectredirect到facebook.com(??? wtf ???)不知道那里发生了什么。

更新: (14-11-2013)

  • iOS 7.0.3:感谢来自binki更新的评论.selectionStart和.selectionEnd 确实工作。

更新: (15-01-2015)

  • iOS 8.xx:感谢Michael Siebert的评论。 从评论采取:我不得不听重点和点击事件,然后setTimeout / _。debounce使它在这两种情况下工作:点击input或焦点通过tab

这个线程没有任何工作对我来说,这是什么在我的iPad上工作:

 // t is the input field setTimeout(function() { t.setSelectionRange(0, 9999); }, 1); 

很难certificate一个消极的,但我的研究表明,这是在移动Safari的一个错误。

请注意,focus()可以或多或less地工作 – 虽然它可能需要多次敲击才能成功,但如果您正尝试响应用户点击相关字段,则不需要进行敲击,因为敲击本身会给出字段焦点。 不幸的是,select()在Mobile Safari中无法使用的。

你最好的select可能是苹果的错误报告。

对不起,在我以前的文章,我没有注意到的Javascript意味着你想在Javascript中的答案。

为了得到你想要在UIWebView中使用JavaScript ,我已经设法刮起两个重要的信息片段,以使其工作。 不确定手机浏览器。

  1. element.setSelectionRange(0,9999); 做我们想要的

  2. mouseUp事件将撤消select

因此(使用原型):

     input.observe('focus',function(){
       this.setSelectionRange(0,9999);
     });
     input.observe('mouseup',function(event){
       event.stop();
     }); 

做的伎俩。

马特

它看起来像焦点将工作,但只有当从本地事件直接调用。 调用焦点使用像SetTimeout不会调出键盘。 ios键盘的控制非常差。 这不是一个好的情况。

类似下面的内容正在为我在Android 2.2上的Webkit工作:

 function trySelect(el) { setTimeout(function() { try { el.select(); } catch (e) { } }, 0); } 

请参阅铬问题32865 。

在iPad上使用iOS 7时,我只能使用<textarea></textarea>而不是<input>字段。

例如

<textarea onclick="this.setSelectionRange(0, 9999);">My text will be selected when textarea is clicked.</textarea>

如何防止用户更改区域内的文字是困难的,因为你是只读textarea的select技巧将不再工作。

我疯狂地寻找这个解决scheme, 而所有的答案确实帮助它为我打开了另一个蠕虫。

客户希望用户能够点击并select全部让用户“选项卡”,并select所有的iPad (用外部键盘,我知道,疯了…)

我解决这个问题的办法是,重新安排事件。 先聚焦 ,然后点击 ,然后touchstart

 $('#myFUBARid').on('focus click touchstart', function(e){ $(this).get(0).setSelectionRange(0,9999); //$(this).css("color", "blue"); e.preventDefault(); }); 

我希望这能帮助别人,因为你无数次帮助了我。

如果您使用的是符合HTML5的浏览器,则可以在input标记中使用placeholder="xxx" 。 这应该做的工作。