私のアプリには縦型のデータ入力フォームがあります。フォームをタブで移動してページの表示部分の下部に到達すると、ページは現在のフォーカスされたフィールドのみをスクロールして表示します（フォーカスは常に画面の下部に残ります）。それはあなたが焦点を当てようとしている次のフィールドを決して見ることができないので迷惑です。 jQueryを使用して、フォーカスを取得したときにフォーカスされたフィールドをウィンドウの上部に自動的にスクロールすることができます（ただし、フォーカスを取得する前に可視領域にない場合のみ）。誰かがプラグインを見たり、私を始めさせる方法を知っていますか？jQueryを使用して長い縦型をスクロールする
「scrollIntoView」というHTML要素メソッドがあり、これはあなたが望むものを正確に行います。 （古いブラウザでは動作しませんが、IE9、Firefox3、Chromeでテストしました）。
また、jqueryの.offset（）および.scrollTop（）関数を使用して、文書のスクロール位置と手元の要素を取得または設定することができます。
<script src="jquery-1.4.4.js"></script>
<script>
function OnFocus(evt) {
this.scrollIntoView(true);
}
window.onload = function (evt) {
$("input").focus(OnFocus);
};
</script>
</head>
<body>
<input type="text" id="text1" value="text1"/> <p> </p>
<input type="text" id="text2" value="text2"/> <p> </p>
<input type="text" id="text3" value="text4"/> <p> </p>
<input type="text" id="text4" value="text5"/> <p> </p>
<input type="text" id="text5" value="text6"/> <p> </p>
<input type="text" id="text6" value="text6"/> <p> </p>
<input type="text" id="text7" value="text7"/> <p> </p>
<input type="text" id="text8" value="text8"/> <p> </p>
<input type="text" id="text9" value="text9"/> <p> </p>
...
<input type="text" id="text34"/> <p> </p>
</body>
私が望んでいたものではありませんが、私はページの特定の要素に以下を追加することにしました。
function ScrollToTop(object) {
$('html,body').animate({ scrollTop: $(object).offset().top - 30 }, 1000, 'linear');
}
そして、特定の要素に：
onfocus="ScrollToTop(this);"
私がいないハードコードにフォーカスイベントを期待していました。私がバインドしてスクリプトを実行できる "scrollingIntoView"イベントがあったらいいですね。とにかく、私のソリューションは素晴らしく優雅です。
scrollIntoViewは常にフォーカスしたフィールドを常に上に保持しますが、これは私が探しているものではありません。特に、フィールドラベルがテキストボックスの上にあるためです。 –