教えて!goo限定 1000名様に電子コミック1000円分が当たる!!

全てのselect要素をデフォルトの値に戻す方法

解決済

  • 質問者：kiseki777
  • 質問日時：
  • 回答数：2件

ページを開いたときは、全てのselect部分ではデフォルトが表示されます。
選択後にブラウザを更新させずに、全てをデフォルトに戻すためには
どのようにしたらよいのでしょうか。
html側でselected="selected"とする方法がありますが、
ブラウザによって対応していなかったりしたので、他に確実な方法を知りたいです。
よろしくお願いします。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>全てのselectをデフォルトにする</title>
</head>
<body>
<form>
<select name="s0" onclick="f(this.form)">
<option value="デフォルト" selected="selected">デフォルト</option>
<option value="A">A</option>
<option value="B">B</option>
</select>
<select name="s1" onclick="f(this.form)">
<option value="デフォルト" selected="selected">デフォルト</option>
<option value="あ">あ</option>
<option value="い">い</option>
</select>
<select name="s2" onclick="f(this.form)">
<option value="デフォルト" selected="selected">デフォルト</option>
<option value="a">a</option>
<option value="b">b</option>
</select>
</form>

<script>
function f(fff){
var aaa = []
var fel;
var sl = document.getElementsByTagName('select').length;
for(i=0; i<sl; i++){
fel = fff.elements["s"+i];
//デフォルトかそうでないかをdefaultSelectedで判断
aaa[i] = fel.options[fel.selectedIndex].defaultSelected;
if( aaa[i] == false ){
//false（=デフォルトでない）場合はデフォルトに戻す
aaa[i] = true;
}
//戻り値をかえして全てをデフォルトにする
return aaa[i];
}
}
</script>
</body>
</html>

通報する

この質問への回答は締め切られました。

質問の本文を隠す

このQ&Aに関連する最新のQ&A

「デフォルテ」に関するQ&A： 日本のデフォルトはいつ起こるか？

さらに表示

「デフォルトとは」に関するQ&A： デフォルトゲートウェイとは？簡単に言うと何？

A 回答 (2件)

No.2ベストアンサー

  • 回答者： yambejp
  • 回答日時：

まずデフォルトとはなにかという定義が必要


たんに各セレクトボックスの最初のoptionであれば
selectedIndexを0にするだけ。

<form>
<select name="s0" onclick="f(this)">
<option value="デフォルト" selected="selected">デフォルト</option>
<option value="A">A</option>
<option value="B">B</option>
</select>
<select name="s1" onclick="f(this)">
<option value="デフォルト" selected="selected">デフォルト</option>
<option value="あ">あ</option>
<option value="い">い</option>
</select>
<select name="s2" onclick="f(this)">
<option value="デフォルト" selected="selected">デフォルト</option>
<option value="a">a</option>
<option value="b">b</option>
</select>
</form>

<script>
function f(obj){
var f=obj.form;
for(var i=0; i<f.length; i++){
if(f[i].type=="select-one" && f[i]!=obj) f[i].selectedIndex=0;
}
}
</script>
    • good
    • 0
    • 件
通報する

No.1

  • 回答者： e_watt
  • 回答日時：

フォームをリセットしてしまえばよろしいかと思います。



a) FORM に resetボタンを追加する。(そのボタンを押したときにリセット)
<input type="reset" value="全部リセットしちゃうよ" />

あるいは、

b) javaScriptからresetメソッドを呼ぶ（呼ぶとリセット）
document.form.reset();
    • good
    • 0
    • 件
通報する

このQ&Aに関連する人気のQ&A

「デフォルトとは」に関するQ&A： [初心者です]ＶＢＡで指定列からＡを検索し、発見したら隣のセルに値0を入れるマクロ。

さらに表示

「デフォルテ」に関するQ&A： デフォルトゲートウェイが使用できない

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

このQ&Aを見た人はこんなQ&Aも見ています

関連するQ&A

関連するカテゴリからQ&Aを探す

専門家回答数ランキング

専門家

※過去一週間分の回答数ランキングです。

Q質問する（無料）

他の専門家の回答をチェック

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qjavascriptでセレクトボックスの"selected"を動的につ

javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。

現在、以下のようなフォームを作成しました。

<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
</select>月

<select name='day'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
<option value='11'>11</option>
<option value='12'>12</option>
<option value='13'>13</option>
<option value='14'>14</option>
<option value='15'>15</option>
<option value='16'>16</option>
<option value='17'>17</option>
<option value='18'>18</option>
<option value='19'>19</option>
<option value='20'>20</option>
<option value='21'>21</option>
<option value='22'>22</option>
<option value='23'>23</option>
<option value='24'>24</option>
<option value='25'>25</option>
<option value='26'>26</option>
<option value='27'>27</option>
<option value='28'>28</option>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日


このセレクトボックスに、例えば今日の日付"2010年9月30日"だったら、それぞれの年、月、日の<option>に"selected"をつけたいのですが、javascriptではどのようにして実現したら良いのでしょうか？

よろしくお願いします。

javascriptでセレクトボックスの"selected"を動的につける方法について質問させてください。

現在、以下のようなフォームを作成しました。

<select name='year'>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8...続きを読む

Aベストアンサー

こんな感じで・・・

<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<option value='2009'>2009</option>
<option value='2010'>2010</option>
<option value='2011'>2011</option>
</select>年

<select name='month'>
<option value='8'>8</option>
<option value='9'>9</option>
<option value='10'>10</option>
</select>月

<select name='day'>
<option value='29'>29</option>
<option value='30'>30</option>
<option value='31'>31</option>
</select>日
</div>
</form>

こんな感じで・・・

<script>
window.onload=function(){
var f=document.getElementById("f0");
var ymd=new Date();
checkSelect(f.elements["year"],ymd.getFullYear());
checkSelect(f.elements["month"],ymd.getMonth() +1);
checkSelect(f.elements["day"],ymd.getDate());
}
function checkSelect(obj,val){
for(var i=0;i<obj.length;i++){
if(obj[i].value==val){
obj[i].selected=true;
break;
}
}
}
</script>
<form id="f0">
<div>
<select name='year'>
<opt...続きを読む

他の回答も見る

Q