6

「Webページの読み込み時にテキストボックスにフォーカスを自動的に設定するにはどうすればよいですか？」という質問への回答として。、Espoは使用を提案します

<body onLoad="document.getElementById('<id>').focus();">

Ben Scheirmanの 返信（詳細な説明なし）：

Javascriptの本では、そのようなbody要素にハンドラーを配置しないように指示されています。

なぜこれは悪い習慣と見なされるのでしょうか？エスポスの回答では、「オーバーライド」の問題が示されています。これが唯一の理由ですか、それとも他に問題がありますか？互換性の問題？

4

8 に答える 8

8

このメソッドを使用してコールバックをスタックできないため、使用onLoadはますます一般的になりつつあります。つまり、新しいonload定義が古い定義をオーバーライドします。

jQueryとそのような最新のフレームワークでは.load()、コールバックを積み重ねることができ、同じページで異なるスクリプトやプラグインなどを使用するときに競合は発生しません。

また、マークアップをコードから分離しておくことは良い習慣と広く見なされているため、使用したい場合でもonload（完全な環境を制御し、何をしているのかを知っていれば、完全に問題ありません）、そのイベントをに添付します。headまたは別のjavaScriptファイルのスクリプト側：

window.onload = function() { document.getElementById...... }
于 2010-04-28T11:23:44.530 に答える
4

以下の場合、要素でonload属性を使用しても問題はありません。<body>

  • ページを完全に制御できます
  • onload現在ページで使用している、または将来使用する可能性のある他のスクリプトは、body要素またはwindowオブジェクトにハンドラーを設定しようとしません。
  • あなたは自分の心を知っていて、マークアップに小さなスクリプトを入れて喜んでいます。

<body onload="...">また、これは正式な標準（HTML 4）の一部ですが、window.onloadそうではありませんが、何年も前のすべての主要なブラウザーに実装されていることにも注意してください。

于 2010-04-28T11:47:24.330 に答える
3

インラインイベントハンドラー属性が一時的に間違っているかどうかの問題を無視すると、onloadイベントは、画像を含むページ全体が読み込まれたときにのみ発生するため、オートフォーカスを配置するのに適した場所ではありません。

これは、ユーザーがオートフォーカスが発生するまでより長く待つ必要があることを意味します。ページの読み込みにかなりの時間がかかる場合は、ブラウザページ（またはアドレスバーなどのクロム）の他の場所にフォーカスしている可能性があります。タイピングの途中で盗まれたフォーカス。これは非常に刺激的です。

オートフォーカスは潜在的に敵対的な機能であり、慎重かつ丁寧に使用する必要があります。その一部は、フォーカスする前の遅延を減らすことです。これを行う最も簡単な方法は、要素自体の直後のスクリプトブロックです。

<input id="x">
<script type="text/javascript">
    document.getElementById('x').focus();
</script>
于 2010-04-28T12:02:51.620 に答える
0

これは他のjavascriptファイルにも関係していると思います。一部のJavaScriptファイルにbodyonloadのハンドラーが含まれていて、ページにインラインbody onloadハンドラーを指定した場合、スクリプト内のハンドラーは実行されません。

于 2010-04-28T11:21:50.117 に答える
0

さて、'<id>'あなたが私に尋ねると、無効なid値です。このような文字は使いません。

また、良い習慣として、window.onloadIMOを使用して<head>タグに配置することをお勧めします。またはさらに良いことに、それを.jsファイルに移動し、速度を上げるためにキャッシュすることができます。

于 2010-04-28T11:25:18.397 に答える
0

JavaScriptに関連しない回答として、アプリケーションのプレゼンテーション層は、テンプレートまたはネストされたテンプレート（dreamweaverやマスターページなど）の形式である可能性があります。この場合、bodyタグに特定のコードを含める必要がないか、他のコードと競合する可能性があります。テンプレートが「継承」される場合に必要

于 2010-04-28T11:26:00.687 に答える
0

後でオーバーライドする可能性がある以外の理由はわかりません。これにより、コードが実行されなくなります。また、控えめなJavaScriptはもはやそれほど高く評価されていません。

代わりに、イベントをリッスンする関数を割り当てる必要があります。あなたはこのようにそれを行うことができます：

function onloadFocus() {
    document.getElementById('<id>').focus();
}

if (window.addEventListener) {      
    window.addEventListener('load', function(e) {onloadFocus();}, false);} 
else if (window.attachEvent) {
    window.attachEvent('onload', function(e) {onloadFocus();}); 
}

...または、同じ機能を提供するjqueryなどのjavascriptフレームワークに依存します。

于 2010-04-28T11:26:14.747 に答える
0

それを見る別の方法はaddEventListener、HTMLコードとして使用する代わりに使用することです。JSを試してください。

<body onLoad="document.getElementById('<id>').focus();">

    <body>

    <script>

     document.body.addEventListener('load', funcLoad);

     function funcLoad(){

     document.getElementById('<id>').focus();

    }

    </script>
</body>

それを試してみてください、それは他の解決策よりもうまくいくかもしれません。

于 2016-02-27T04:18:37.460 に答える