自动突出显示焦点上的输入字段

Question

我想知道输入框内是否存在文本方式(使用value =""预先加载),以便在用户点击它时突出显示？

input type='text' name='url' id='url' value='http://www.a-link.com/' />

编辑

我需要突出显示的文本,以便用户可以复制它.

Answer 1

<input type="text" name="textbox" value="Test" onclick="this.select()" />

1）如果将其绑定到“onfocus”而不是“onclick”，那么它将适用于键盘导航和鼠标单击。2) 您还可以从发出的事件对象而不是“this”访问输入字段。例如，对于反应，您可以执行“<input onFocus={e => e.target.select()} />” (3认同)

Answer 2

您可以将javascript附加到click事件以选择文本,如下所示:

$(document).ready( function() {
  $('#id').click( function( event_details ) {
    $(this).select();
  });
});

有一个潜在的问题,用户可能会尝试在文本中稍后点击以更正输入错误并最终选择整个事情.更好的方法是在输入从用户获得焦点时触发此操作.你会替换.click与.focus上面的例子.

Answer 3

添加以下onclick属性以使整个<input>用户点击时自动突出显示:

<input type="text" value="Test1" onclick="this.select()" />

或者,如果您希望用户能够在初始单击后更改选择,请将onclick属性更改为onfocus属性.这也将突出显示<input>用户点击它时的整个过程,但它允许他们之后手动更改突出显示的部分:

<input type="text" value="Test2" onfocus="this.select()" />

以下是两个输入实例的示例.