web-dev-qa-db-ja.com

JavaScriptがHTMLフォーム要素にフォーカスを設定

テキストボックスを含むWebフォームがあります。デフォルトでテキストボックスにフォーカスを設定する方法は？

このようなもの：

<body onload='setFocusToTextBox()'>

誰かが私を助けてくれる？ JavaScriptでテキストボックスにフォーカスを設定する方法がわかりません。

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

これを行う。

あなたの要素がこのようなものであれば..

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

あなたのスクリプトは

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

その価値があるので、HTML5互換ブラウザでautofocus属性を使うことができます。バージョン10以降のIEでも動作します。

<input name="myinput" value="whatever" autofocus />
128
a better oliver

通常、テキストボックスにフォーカスしているときは、ビューにスクロールする必要があります。

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

それが役立つかどうか確認してください。

60
Khanh TO

あなたのコードが

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

そして、あなたがJQueryを使っているなら、あなたもこれを使うことができます：

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

あなたが最初に入力を引かなければならないことを覚えておいてください$(document).ready()

25
Richard Rebeco

普通のJavascriptの場合は、次のことを試してください。

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

私はこれを使用していました：

<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属性を使用できます。

注意してください：私はこの古いスレッドを更新したいと思っている例に加えて、まだこれを読んでいる人のためのより新しく、より簡単な更新を示したかった。 ;）

2
user6558655

前述のように、 document.forms も動作します。

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

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

window.onloadは、最初にフォーカスを置くことですonblurは、textareaの外側をクリックしたときにフォーカスを置くことです。

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

    mytexarea.focus();

    }

mytextarea.onblur=function(){

mytextarea.focus();

}
    </script>
0
ßãlãjî

あなたの<input>または<textarea>がid=mytext属性を持っているならば、それから使用してください

mytext.focus();

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