programing

페이지로드시 입력 필드와 그 안의 텍스트를 자동으로 선택하는 방법

nasanasas 2020. 11. 26. 08:27
반응형

페이지로드시 입력 필드와 그 안의 텍스트를 자동으로 선택하는 방법


페이지가로드되면 커서를 특정 필드로 이동하고 싶습니다. 문제 없어요. 그러나 해당 텍스트 필드에있는 기본값을 선택하고 강조 표시해야합니다.


에서 http://www.codeave.com/javascript/code.asp?u_log=7004 :

var input = document.getElementById('myTextInput');
input.focus();
input.select();
<input id="myTextInput" value="Hello world!" />


입력 태그에 다음을 배치하십시오.

onFocus="this.select()"

이 시도. 이것은 Firefox와 크롬 모두에서 작동합니다.

<input type="text" value="test" autofocus="autofocus" onfocus="this.select()">


페이지로드시 수행하려면 :

window.onload = function () {
  var input = document.getElementById('myTextInput');
  input.focus();
  input.select();
}
<input id="myTextInput" value="Hello world!" />


잘 작동하는 매우 간단한 방법을 찾았습니다.

<input type="text" onclick="this.focus();this.select()">

jquery를 사용할 때 ...

html :

<input type='text' value='hello world' id='hello-world-input'>

jquery :

$(function() {
  $('#hello-world-input').focus().select();
});

예 : https://jsfiddle.net/seanmcmills/xmh4e0d4/


    var input = document.getElementById('myTextInput');
    input.focus();
    input.setSelectionRange( 6,  19 );
    <input id="myTextInput" value="Hello default value world!" />

텍스트 필드에서 특정 텍스트 선택

또한 다음과 같이 사용할 수 있습니다.

input.selectionStart = 6;
input.selectionEnd = 19;

참고 URL : https://stackoverflow.com/questions/210761/how-to-auto-select-an-input-field-and-the-text-in-it-on-page-load

반응형