セレクトボックス(A)を使用して、(A)の選択結果により(A)以降をアクティブ・非アクティブに切り替えたいのです。
アクティブ・非アクティブの切り替え自体は正常に動くのですが、一度「送信する」をクリックした後、次の画面に移動し、その後「戻る」をクリックorブラウザの戻るで元のページに戻ると、アクティブ化できていたセレクトボックス(C)が全て非アクティブとなってしまっているのです。
原因は何でしょうか?よろしくお願いいたします。
function setTF() {
n = document.mail.Data.selectedIndex;
flag = eval(document.mail.Data.options[n].value);
document.mail["B"].disabled = flag;
document.mail["C"].disabled = flag;
}
※以下HTML※
<form action="mail.cgi" method="post" name="mail">
<table>
<tr>
<th>セレクトボックス(A)</th>
<td><select name="Data" onchange="setTF()">
<option value="false">アクティブ</option>
<option value="true" selected="selected">非アクティブ</option>
</select></td>
</tr><tr>
<th>テキスト(B)</th>
<td><input size="4" type="text" name="B" disabled="disabled" /> 才</td>
</tr><tr>
<th>セレクトボックス(C)</th>
<td><select name="C" disabled="disabled">
<option>選択肢1</option>
<option>選択肢2</option>
</select></td>
</tr><tr>
<td colspan="2" class="submit"><input type="submit" value="送信する" /><input type="reset" value="リセット" /></td>
</tr>
</table>
</form>
No.3ベストアンサー
- 回答日時:
「戻る」というのはブラウザの仕様によってだいぶ違いますね。
前も同様の質問があがっていましたが、IEは戻るときもある程度
リロードされます。なのでonloadで処理すればよいでしょう。
(firefoxはキャッシュを読んでくれるようなのでonloadは無視してくれます)
したがって#1さんの処理に近くなりますが、onload時にfunctionを指定する
ならかっこをつけてはいけません。
window.onload = setTF()→window.onload = setTF
それとformのnameはすでに非推奨になっているので、idで管理した方が
よいでしょう。総じてこんな感じ
<script>
function setTF() {
var f=document.getElementById('mail');
var flag = f.Data.value==""?false:true;
f.B.disabled = flag;
f.C.disabled = flag;
}
window.onload=setTF;
</script>
<form method="post" id="mail">
<table>
<tr>
<th>セレクトボックス(A)</th>
<td><select name="Data" onchange="setTF()">
<option value="">アクティブ</option>
<option value="non-active" selected>非アクティブ</option>
</select></td>
</tr><tr>
<th>テキスト(B)</th>
<td><input size="4" type="text" name="B" disabled /> 才</td>
</tr><tr>
<th>セレクトボックス(C)</th>
<td><select name="C" disabled>
<option>選択肢1</option>
<option>選択肢2</option>
</select></td>
</tr><tr>
<td colspan="2" class="submit"><input type="submit" value="送信する" /><input type="reset" value="リセット" /></td>
</tr>
</table>
</form>
No.2
- 回答日時:
<form>タグの設定が優先されるようです。
そこで、<input><select>タグから
disabled="disabled"
を取り除き、onloadプロパティを追加したらどうでしょう。
-------------------------------------------------------------
onload=function() {
// alert(document.mail.Data.selectedIndex);
if (document.mail.Data.selectedIndex==1) {
document.mail["B"].disabled = true;
document.mail["C"].disabled = true;
}
}
-------------------------------------------------------------
セレクトボックス(A)が非アクティブのときのみ、無効にします。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- AJAX JavascriptからPHPへのAjax通信でnullが返ってくる 3 2022/08/03 22:00
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- Visual Basic(VBA) Selenium.ChromeDriverの使い方について 7 2022/09/22 06:43
- JavaScript セレクトを全て選択されていないと、文字によるエラーメッセージを表示させるコードを調べています 2 2023/06/22 15:48
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript EasyUIのSubGrid(jquery)におけるObjectに入れた連想配列について 1 2022/05/02 11:21
- JavaScript セレクトボックスを2つ設けて選択して初めてメッセを表示 1 2022/07/27 12:15
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
プルダウン選択を変更すると、...
-
select要素のvalueを配列で取得...
-
ラジオボタンとプルダウンを連...
-
セレクトボックスを2つ選択して...
-
ラジオボタンの選択に応じてプ...
-
プルダウンで選択した項目にあ...
-
セレクトボックスを使用した、...
-
selectを変更不可にしたい
-
【javascript】連想配列からセ...
-
mailto機能について
-
return trueとreturn falseの用...
-
slickのレスポンシブ > center...
-
FormのonsubmitでJavaスクリプ...
-
onchangeイベントを強制的に発...
-
submitがおされた同時に JavaSc...
-
Selectボックスの幅を自動で広...
-
HTMLファイル同士での値渡し
-
ラジオボタンの値でリンク先を...
-
Selectの中身をfor文で入れる
-
JQuery selectが反映されない
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
javascriptでセレクトボックス...
-
selectを変更不可にしたい
-
全てのselect要素をデフォルト...
-
<input>の選択肢をプルダウンメ...
-
Selectボックスの一覧表示方法
-
プルダウン選択を変更すると、...
-
セレクトボックスで配列を呼び...
-
JavaScriptで<select>の<option...
-
プルダウンのoptionの表示・非...
-
select要素のvalueを配列で取得...
-
【javascript】連想配列からセ...
-
ラジオボタンとプルダウンを連...
-
同じ名前のセレクトがある場合...
-
selectボックスの選択結果を変...
-
プルダウンの値によって活性・...
-
javascriptで合計金額を算出し...
-
プルダウンメニューに連動する...
-
リストボックス内の重複したも...
-
VBScriptでHTMLのセレクトボッ...
-
連想配列を使ってコンボボック...
おすすめ情報