2009-03-09 10 views
3

htmlで次のような動作を実現しようとしています。ユーザーには複数のテキストフィールドを含むフォームが表示されます。フィールドにはデフォルト値が設定されていますが、多くの場合、ユーザーは独自の値を入力します。ページが読み込まれると、最初のフィールドの値が選択されるので、ユーザーは入力して次のフィールドにタブで移動するか、単にタブとタブを残すだけで置き換えることができます。ここで私が持っているもののダウン切り詰め例を示します。最初のJavascriptを使用したIEでのタブ順序の問題

<html> 
    <body onload="document.getElementById('helloField').select()"> 
     <form> 
      <input id="helloField" value="hello"/><br/> 
      <input value="goodbye"/><br/> 
      <input type="submit" value="Submit"/> 
     </form> 
    </body> 
</html> 

これはChromeで動作します(とFirefox、私は信じているが、私はここでそれを持っていません)。 IEでは、フィールドは意図したとおりに選択されますが、ユーザーがタブを押すと、ブラウザは別れフィールドではなくアドレスバーにタブアウトします。私はシンプルなフォーカスと選択を交換した場合、

<body onload="document.getElementById('helloField').focus()"> 

のようにタブ移動は、すべてのブラウザで大丈夫ですが、これは私が欲しいものではありません。私は、ユーザーがすぐにデフォルト値を置き換えるために入力を開始できるようにします。

誰もが考えている?

ありがとうございました。

答えて

6

フォーカス、その後、選択します。

また、問題の入力後すぐにスクリプトブロックにコードを挿入することを検討してください。ページ上にたくさんの画像がある場合、document.onloadはかなり後で起動することができます。最後に、オンロードが発生してフォーカスを乗り越えたときに入力ボックスに入力する必要があります。ボックス)。

<input id="helloField" value="hello"/><br/> 
<script type="text/javascript"> 
    var hello= document.getElementById('helloField'); 
    hello.focus(); 
    hello.select(); 
</script> 
1

はtabindex属性を使用してフィールドのタブ順序を設定してみてください:

<html> 
    <body onload="document.getElementById('helloField').select()"> 
     <form> 
      <input id="helloField" value="hello" tabindex="1" /><br/> 
      <input value="goodbye" tabindex="2" /><br/> 
      <input type="submit" value="Submit" tabindex="3" /> 
     </form> 
    </body> 
</html> 
+0

残念ながら、それはうまくいきませんでした。 – jjujuma

関連する問題