jQueryを使用してwebappを開発しています。 3行の入力フィールドの新しい行を追加する機能があります。これらのDOM要素を作成した後、入力フィールドの1つにフォーカスを当てたいと思います。私は必要な入力フィールドにjQuery focus()関数を呼び出すことでそれをやっています。jQuery focus()がIE8で動作しない場合があります
問題は、IE6とFF3.5ではfocus()を呼び出してもうまく動作しますが、IE8では動作しません。
私はここにこの問題を示すための簡単な作業例を作ろうとしていましたが、コードfocus()のストリップバージョンがうまくいきました。 IE8でfocus()を呼び出すとDOMがまだ準備されていないと思います。このため、私はsetTimeout( 'myFocus()'、400)を呼び出してみました。私は成功を収めましたが、焦点の一部は実際には機能していましたが、必ずしもそうではありません。無作為に入力フィールドにフォーカスを当てません。
質問:誰も同じような問題に直面しているのですか?どのように解決策を講じるのですか? setTimeoutを使用すると、非常に醜い回避策のように感じます。事前
で
TNXは編集:2009年8月26日
は、簡単な例に再現することに成功しました。 IE8でこのバグを再現するHTML + JSコードです。再現する
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function performChanged() {
formChanged = true;
}
function handleChange() {
var parentDiv = $('#container');
newValue = $(html).html();
parentDiv.html(newValue);
$(".sel1",parentDiv).bind('change',handleChange);
//alert('Uncomment this and after alert focus will be on input');
$("input.cv_values",parentDiv).focus();
}
$(document).ready(function() {
$('.trackChange').bind('change', handleChange);
});
var html = '<div class=\"div1\">\n<select class=\"sel1\" id=\"sel1\" name=\"sel1\"><option value=\"\"><\/option>\n<option value=\"11\">Select me to see problem<\/option>\n<\/select>\n\n\n<input class=\"cv_values\" id=\"sel3\" name=\"sel3\" size=\"30\" type=\"text\" value=\"\" /><br/>Focus should in input field. With alert it is but without alert focus is not there</div>';
</script>
</head>
<body>
<select class="trackChange" onchange='performChanged();'>
<option value=""></option>
<option value="1" >Select me to generate new inputs</option>
</select>
<div id="container"></div>
</body>
: 1)最初のドロップダウンから選択値。最初の入力が機能していることがわかります 2)2番目のドロップダウンから値を選択してください。バグが再現されていることがわかります。
コードでは、JS alert()が表示されている行をコメントアウトすることができます。奇妙なことは、このアラートがある場合()、その後はフォーカスがうまくいきます。
これは私の問題がどこにあるかを理解するのに役立ちます。
P.S.私のアプリはこのように動作する必要があります - ドロップダウンから値を選択した後、それらの入力を再生成しています。これは私のアプリの単純な例です;)。あなたが使用している任意のコードを投稿していないので
コードスニペットを投稿してください。物事を楽にする。 – krishna
あなたは "DOMContentLoaded"、a.k.a. - 'document.ready(...)' - ではなく、ウィンドウの "load"イベントに焦点を当ててみましたか? – kangax