Programing

JavaScript는 HTML 양식 요소에 중점을 둡니다.

lottogame 2020. 3. 12. 08:07
반응형

JavaScript는 HTML 양식 요소에 중점을 둡니다.


텍스트 상자가있는 웹 양식이 있습니다. 기본적으로 텍스트 상자에 포커스를 설정하는 방법은 무엇입니까?

이 같은:

<body onload='setFocusToTextBox()'>

아무도 도와 줄 수 있습니까? JavaScript로 텍스트 상자에 포커스를 설정하는 방법을 모르겠습니다.

<script>
function setFocusToTextBox(){
//What to do here
}
</script>

이 작업을 수행.

당신의 요소가 이와 같은 경우 ..

<input type="text" id="mytext"/>

당신의 스크립트는

<script>
function setFocusToTextBox(){
    document.getElementById("mytext").focus();
}
</script>

가치있는 것을 위해 autofocusHTML5 호환 브라우저 에서 속성을 사용할 수 있습니다 . 버전 10부터 IE에서도 작동합니다.

<input name="myinput" value="whatever" autofocus />

일반적으로 텍스트 상자에 초점을 맞출 때도 스크롤해야합니다

function setFocusToTextBox(){
    var textbox = document.getElementById("yourtextbox");
    textbox.focus();
    textbox.scrollIntoView();
}

도움이되는지 확인하십시오.


코드가 다음과 같은 경우 :

<input type="text" id="mytext"/>

그리고 JQuery를 사용하고 있다면 이것을 사용할 수도 있습니다.

<script>
function setFocusToTextBox(){
    $("#mytext").focus();
}
</script>

먼저 입력을 그려야합니다. $(document).ready()


일반 자바 스크립트의 경우 다음을 시도하십시오.

window.onload = function() {
  document.getElementById("TextBoxName").focus();
};

나는 이것을 이것을 사용했다.

<html>
  <head>
    <script type="text/javascript">
      function focusFieldOne() {
        document.FormName.FieldName.focus();
      }
    </script>
  </head>

  <body onLoad="focusFieldOne();">
    <form name="FormName">
      Field <input type="text" name="FieldName">
    </form>
  </body>
</html>

즉, HTML 5에서 autofocus 속성을 사용할 수 있습니다.

참고 사항 :이 예제를 보여주는이 오래된 스레드와이를 읽는 사람들을위한 더 새롭고 쉬운 업데이트를 업데이트하고 싶습니다. ;)


앞에서 언급했듯이 document.forms도 작동합니다.

function setFocusToTextBox( _element ) {
  document.forms[ 'myFormName' ].elements[ _element ].focus();
}

setFocusToTextBox( 0 );
// sets focus on first element of the form

경우 <input>또는 <textarea>속성은 한 id=mytext다음 사용

mytext.focus();

function setFocusToTextBox() {
    mytext.focus();
}
<body onload='setFocusToTextBox()'>
  <form>
    <input type="text" id="mytext"/>
  </form>
</body>


window.onload는 처음에 초점을 맞추는 것입니다 .blur는 텍스트 영역 외부를 클릭하는 동안 초점을 맞추는 것입니다.

    <textarea id="focus"></textarea>
    <script>
     var mytexarea=document.getElementById("focus");
    window.onload=function()
    {

    mytexarea.focus();

    }

mytextarea.onblur=function(){

mytextarea.focus();

}
    </script>

참고 URL : https://stackoverflow.com/questions/17500704/javascript-set-focus-to-html-form-element

반응형