optionのselectedは更新時は効かない？
- ブラウザの更新をしたときにselectedが効きません。
- 読み込んだときは指定通りになりますが、更新時は指定通りになりません。
- optionタグのselected属性は、ブラウザの更新時には効果がありません。読み込んだときには指定通りに選択されますが、更新時には選択が解除されてしまいます。
- ベストアンサー
optionのselectedは更新時は効かない？
最初に表示させたいoptionにselected="selected"を付けているのですが、 ブラウザの更新をしたときにselectedが効きません。 読み込んだときは指定通りになりますが、更新時は指定通りになりません。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift-JIS" /> <title>サンプル</title> </head> <body> <form action="#"> <fieldset> <legend>順位１</legend> <select name="sss111" onchange="letsGO111()"> <option value="指定無し" selected="selected">指定無し</option> <option value="1位">1位</option> <option value="2位">2位</option> </select> </fieldset> <fieldset> <legend>順位２</legend> <select name="sss222" onchange="letsGO222()"> <option value="指定無し" selected="selected">指定無し</option> <option value="1位">1位</option> <option value="2位">2位</option> </select> </fieldset> </form> </body> </html>
- kiseki777
- お礼率80% (211/261)
- HTML
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
1.アンケートとかで選択肢全部選び終わった 2.さて送信するか 3.間違って更新しちゃった 4.全部消えたあぁぁぁ＞＜ ってことがあったら嫌でしょ？ ブラウザにもよるだろうけど、Firefoxはformへの入力はできるだけ保持するようにしてるみたい。 絶対に希望通りの動作させたいなら、JavaScriptで制御すればよいと思う。
関連するQ&A
- 名前と名字をそれぞれ比較して表示する
名字と名前に分けて、selectで比較するものを作りたいです。 名前は無視して「山田」という名字のみを比較する場合、 「あああ」という名字で「太郎」という名前を比較する場合 全部を無視して比較する場合など、で比較したいです。 名字を無視して名前のみを比較するものは使いません。 <dd><p>山田太郎</p></dd>というのを変えずに、 あまりコードを増やさずにやりたくて htm.match(sn) && sm="指定なし"な感じにやってみたのですが、 上手にできません。この場合どんなものが役立つのでしょうか。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio … <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <title>サンプル</title> </head> <body> <form action="#"> <fieldset> <legend>名字</legend> <select name="m" onchange="aaa(this.form)"> <option value="日本">日本</option> <option value="山田">山田</option> <option value="あああ">あああ</option> <option value="い">い</option> <option value="う">う</option> <option value="え">え</option> </select> </fieldset> <fieldset> <legend>名前</legend> <select name="n" onchange="aaa(this.form)"> <option value="太郎">太郎</option> <option value="花子">花子</option> <option value="ままま">ままま</option> <option value="みみ">みみ</option> <option value="む">む</option> </select> </fieldset> </form> <dl> <dt>名前</dt> <dd><p>日本太郎</p></dd> </dl> <dl> <dt>名前</dt> <dd><p>い花子</p></dd> </dl> <dl> <dt>名前</dt> <dd><p>山田太郎</p></dd> </dl> <script type="text/javascript"> function aaa(f){ var sn = f.n.value; var sm = f.m.value; var idID = document.getElementsByTagName('p'); var idLen = idID.length; for(i=0; i<idLen; i++){ var htm = idID[i].innerHTML; if(htm==sn+sm || htm.match(sn) && sm="指定なし" || sn="指定なし"){ alert("true"); }else{ alert("false"); } } } </script> </body> </html>
- ベストアンサー
- JavaScript
- 数値の比較で正しく評価されない理由
下記サンプルで、trueになるべきところがfalseになります。なぜでしょうか。 このサンプルでは識別番号のラスト値のみを比較するものですが、 実際は複数の<dd>の値を比較します。 NO12「DE」-114 という1行の文章に複数の比較する対象が含まれる場合は、 １つの<dd>に<span>で囲い【NO12】、【「DE」】、【114】のそれぞれを比較の対象にしますが、 こういったやり方自体が間違っているのでしょうか。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <title>サンプル</title> </head> <body> <form action="#"> <fieldset> <legend>識別番号のラスト値</legend> <select name="sss" onchange="spl(this.form)"> <option value="50">50以下</option> <option value="100">100以下</option> <option value="150">150以下</option> <option value="200">200以下</option> </select> </fieldset> </form> <dl> <dt>名前</dt> <dd>ジム</dd> <dt>識別番号</dt> <dd><p><span>NO12</span>「<span>DE</span>」-<span>114</span></p></dd> </dl> <dl> <dt>名前</dt> <dd>トム</dd> <dt>識別番号</dt> <dd><p><span>NO33</span>「<span>DR</span>」-<span>168</span></p></dd> </dl> <dl> <dt>名前</dt> <dd>エミリー</dd> <dt>識別番号</dt> <dd><p><span>NO8</span>「<span>AB</span>」-<span>93</span></p></dd> </dl> <script type="text/javascript"> function spl(f){ var selValue = f.sss.value; var idID = document.getElementsByTagName('p'); var idLen = idID.length; for(i=0; i<idLen; i++){ var spans = idID[i].getElementsByTagName('span'); var pawwar = spans[2].innerHTML; if(pawwar<=selValue){ alert("true"); }else{ alert("false"); } } } </script> </body> </html>
- ベストアンサー
- JavaScript
- プルダウンをもう一つ増やしたい＆フレームページで使用のため、別ウインドウで表示させたい
↓他サイトさんにてサンプルで置いてあったものを拝借して自分なりにやってみました。 １、これをさらにもうひとつプルダウンを選択させて他サイトへジャンプさせる場合はどのようにしたらよいですか。 ２、フレームページで使うので、他サイトの表示を別ウインドウで表示させたいのですが、どのようにしたらよいですか。 よろしくお願いします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN""http:///www.w3.org/TR/html4/frameset.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title></title> <script type="text/javascript" language="JavaScript"> <!-- function showthis(obj) { if(!obj) return false; if(document.getElementById) { document.getElementById("item1").style.display = "none"; document.getElementById("item2").style.display = "none"; document.getElementById("item3").style.display = "none"; document.getElementById(obj).style.display = "inline"; } else { return false; } } // --> </script> <style type="text/css"> #item1,#item2,#item3 { display: none; } </style> </head> <body> <form> <select onchange="showthis(this.value)"> <option selected="selected">選んでください</option> <option value="item1"></option> <option value="item2"></option> <option value="item3"></option> </select> <select id="item1" onchange="location=this.value"> <option selected="selected">選んでください</option> <option value=""></option> <option value=""></option> <option value=""></option> </select> <select id="item2" onchange="location=this.value"> <option selected="selected">選んでください</option> <option value=""></option> <option value=""></option> <option value=""></option> </select> <select id="item3" onchange="location=this.value"> <option selected="selected">選んでください</option> <option value=""></option> <option value=""></option> <option value=""></option> </select> </form> </body> </html>
- ベストアンサー
- JavaScript
- プルダウンメニューのselected部分のリンクをとる方法
以前こちらで教えていただいたプルダウンメニューなのですが、 selected部分にもリンクがされてしまっているので、 これをリンクさせないようにしたいのですが、やり方がわかりません。 どなたか教えていただけますでしょうか？ 宜しくお願いいたします。 ソース <form name="b" method="post" target="_blank" action="https://○○○○/reservationtop.asp"> <select name="***************" onChange="document.b.submit()"> <option selected>予約する</option> <option value="1">リンク3</option> <option value="2">リンク2</option> <option value="3">リンク3</option> </select>
- 締切済み
- JavaScript
- webページの一部のみの更新について
JavaScript初心者です。 PHPとXHTMLでHPを作成中ですが、タイトルにあるようにHPの一部のみ更新することが可能でしょうか？ JavaScriptで不可能な場合はどの言語で出来ますか? やりたいことはセレクトで選択したらobjectで表示中のページのみ変更する事です。 分からないなりに作ってみたサンプルの結果がこれです。 index.php ------------------------ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <title>サンプル</title> </head> <body> <div> <div> <form action="aaa.php" method="post"> <select name="category" id="category" onchange="submit();"> <option value="0">A</option> <option value="1">B</option> <option value="2">C</option> <option value="3">D</option> ・ ・ ・ <option value="25">Z</option> </select> </form> <object data='test.php?category='<?=$_POST['category']?> height="50" width="200" ></object> </div> ここに別要素の表示<br /> 出来れば更新したくない。 <div> </div> </body> </html> ------------------------ test.php ------------------------ <html> <body> <?php if($_POST['category']==0){ $a='AAA'; }elseif($_POST['category']==1){ $a='BBB'; }elseif($_POST['category']==2){ $a='CCC'; }elseif($_POST['category']==3){ $a='ddd'; }elseif($_POST['category']==25){ $a='ZZZ'; } print $a.'が選択されました。'; ?> </body> </html> ------------------------ これだとtest.phpにパラメータが送れませんし、セレクトで選択しても更新がかかって初期のAに戻ってしまいます。 かといって<form action="test.php" method="post">にするとtest.phpへ飛んでしまいます。 出来れば詳しいサンプルコードを教えていただけるとありがたいです。
- ベストアンサー
- JavaScript
- IE7で○の記号が小さく表示されてしまいます
IE7で○の記号が小さく表示されてしまいます。 調べたところ、IE7のバグで文字コードにutf-8を使用してフォント指定をしない場合に起きるようです。 以下のサイトを見てコードを修正したのですが、○のサイズは小さいままでした。 http://blog.btmup.com/web-general/ie7-symbol-small.html こちらのサイトの文字コードはutf-8ですが、○は正常なサイズで表示されます。 http://okwave.jp/qa/q4611331.html 何が悪いのでしょうか？ どなたかご指摘をお願いします。 /**** ソースコード ****/ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <style type="text/css"> body { font-family: Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; } </style> <body> <p>test</p> <select> <option value="1">○</option> <option value="2">●</option> <option value="3">△</option> <option value="4">◎</option> </select> </body> </html>
- 締切済み
- HTML
- option:selectedで想定の値が取れない
こんにちは。 今、htmlとJavascriptでinput要素の入力欄に入力した値を追加ボタンを押すとdatalistの入力候補に追加され、削除ボタンを押すと入力候補から値を削除するソースを作成しています。 Javascriptの方でテキスト欄に表示されている値を取得したいときはoption:selectedを指定するといいはずですが、リストの何を表示してもリストの一番上の値が削除されてしまいます。 datalistの中にselectを書いているせいなのかとも思いますが、分かりません。 どなたかご教授ください。お願いします。 ざっくりとソースを書くと以下のようになります。 【HTML】 <input type="text" value="" list="alphabet"> <datalist id='alphabet'> <select id='alphabet'> <option value='ABC'></option> <option value='DEF'></option> <option value='GHI'></option> <option value='JKL'></option> </select>
- 締切済み
- JavaScript
- PHP プルダウンメニュー MYSQL
PHPを習い始めているのですがどうしても分からない問題が出てきました。 プルダウンメニューを作成し、その中の項目を選択すると検索ボタンをお押さずに別のページにとび、選択項目の必要情報（全件情報）をページが切り替わったと同時にMYSQLから吐き出したいのですが、どうしてもやり方が分かりません。 色々と調べていたらjavascriptを使い検索ボタンを押さずに、 プルダウンから項目を選んだだけでページは切り替わることは出来たのですが、その次の工程にしているページが切り替わったと同時に選択項目の 必要情報を画面に出力する方法が分かりません、、 下にあるスクリプトでプルダウンから直接違うページに飛ばしており、 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <SCRIPT LANGUAGE="JavaScript"><!-- function Jump() { tu = document.f.elements['jumpto'].options[document.f.elements['jumpto'].selectedIndex].value if( tu != '-' ) { location.href = tu; } else { alert('移動先を選択して下さい。'); } } // --></SCRIPT> <FORM NAME="f"> <SELECT NAME="jumpto" onChange="Jump();"> <OPTION VALUE="-" SELECTED>移動先を選択</OPTION> <option value="page1.php" >aaa</option> <option value="page2.php" >bbb</option> <option value="page3.php">ccc</option> <option value="page.php">ddd</option> </SELECT> </FORM> 例えばpage1.phpに飛んで、ページが切り替わったと同時に 全件情報を出力したいのですが どのたかお分かりになるかたが いましたら是非お伺い出来ませんでしょうか？ 宜しくお願い致します。
- ベストアンサー
- PHP
- XHTMLの文字コードのEUC-JPの文字化け
いつもはHTML４.01で作業をしていて XHTMLはどうも不慣れなせいか 今、外注が作成したHPを修正していて 文字コードをEUC-JPにどうしても変更しなければならないのですが それがうまくいかず、文字化けが発生してます。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> を <?xml version="1.0" encoding="euc-jp"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=euc-jp" /> このように設定したら文字化けが発生しました。 どのように設定したら文字化けがなくなりますか？
- ベストアンサー
- その他([技術者向] コンピューター)
- javascriptでphpに値渡し
javascriptとphpで値のやりとりをしたいのですが、やりかたがわかりません。 以下のプログラムはセレクトメニューで選択された文字によって'a','ka','sa'....と 自作関数のSelected()に値を渡しています。 "alert(value);"をSelected()関数内に書いて、引数が正しく渡され実行できることは確認しました。 そこで、今度はSelected()関数に渡された引数valueをphpファイルに送って、 php側で引数に応じた処理をさせたいのですが、 Selected()関数内にどのように書けば良いのかがわかりません。 ちなみに渡したいphpのファイル名は"connect_mysql.php"で、 以下のプログラムが書かれたファイルと同階層にあります。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <html lang="ja"> <meta http-equiv="content-type" content="text/html; charset=UTF-8" > <meta http-equiv="Content-Script-Type" content="text/javascript"> <head> <title>test page</title> </head> <script type="text/javascript"> function Selected(value){ //ここで引数valueをphp側に渡したい // "alert(value);"を書いてSelected()関数が正しく呼び出され実行されることを確認済み } </script> <body> <form> <div id="name_selectors" class="name_select flo_l"> <select id="aiueo" class="aiueo_list flo_l" size="5" onchange="Selected(this[this.selectedIndex].value)"> <!--↓五十音一覧--> <option id="a" value="a" class="category_aiueo" > あ行 </option> <option id="ka" value="ka" class="category_aiueo" > か行 </option> <option id="sa" value="sa" class="category_aiueo" > さ行 </option> ・ ・ ・ <option id="ra" value="ra" class="category_aiueo" > ら、わ行 </option> </select> <!--↑五十音 end--> </div> </form> </body> </html>
- ベストアンサー
- JavaScript
お礼
そうですか、疑問が解消されました。 有難うございます。