みんなの「教えて(疑問・質問)」にみんなで「答える」Q&Aコミュニティ

こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

解決済みの質問

Win版SafariのSELECT要素追加について

SELECTの要素を都度セットするJavaScriptを作りました。
下記ソースはSELECTの要素を一旦削除して、新しく1~
テキストボックスに入力した値までの要素を追加するscriptです。


<html>
<hade>
<script language="JavaScript"><!--
function creSel()
{
var to = Number(document.myFORM.myTEXT.value);
document.myFORM.mySELECT.options.length = 0;
for( i=0; i<to; i++ )
document.myFORM.mySELECT.options[i] = new Option(i+1);
document.myFORM.mySELECT.selectedIndex = 0;
}
// --></script>

</head>
<body>
<form name="myFORM">
数値:<input type="text" name="myTEXT">
<input type="button" onClick="creSel()" value="SET"><br>
<select name="mySELECT">
</select>
</form>
</body>
</html>

IE、FireFox、Opera等のブラウザでは問題なく動作しましたが、
Win版のSafariのみ正常に動作しません。
10とか20くらいの数値だと問題ありませんが、例えば25とか
入力して、一旦1~25までのSELECTにして、次に24と入力する
と25の要素が残ります。しかし、25は選択できない様です。
更に、26と入力すると、26は追加されません。
これはどうやら、SELECTメニューにスクロールバーが出るらへん
の要素数になると発生する問題の様です。

Win版Safariのバグだとは思われますが、
この問題を回避する何か良い方法は御座いませんでしょうか。

宜しくお願いします。

投稿日時 - 2008-03-28 00:54:42

QNo.3900885

暇なときに回答ください

質問者が選んだベストアンサー

optionの操作で問題が出るようですから、
selectごと作り直すようにすると、とりあえず解決するようです。
(selectをspanで囲って中身を作り直す)

<html>
<hade>
<script type="text/javascript">
function creSel(){
var SP = document.getElementById('S');
while(SP.firstChild)SP.removeChild(SP.firstChild);
var S = document.createElement('select');
S.name ='mySELECT';
var to = Number(myFORM.myTEXT.value);
for(var i=0;i<to; i++) {
var O = document.createElement('option');
O.appendChild(document.createTextNode(i+1));
S.appendChild( O );
}
SP.appendChild(S);
}
</script>

</head>
<body>
<form name="myFORM">
数値:<input type="text" name="myTEXT">
<input type="button" onClick="creSel()" value="SET"><br>
<span id="S"><select></select></span>
</form>
</body>
</html>

投稿日時 - 2008-03-28 19:21:48

お礼

ご回答ありがとうございます。
このやり方で何とかなりそうです。大変勉強になりました。

投稿日時 - 2008-03-28 21:58:01

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

あなたにオススメの質問