- ベストアンサー
Webの遷移制御をしたいのですが
- Webの遷移制御をするための方法について相談です。
- 具体的なパターンについて説明します。
- JavaScriptでの対応方法についてお知りになりたいです。
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
補足いただいたソースの中では、 何でいきなり document.write("<input type='hidden' name='select1' value='",val["select1"],"' />"); かがよく分からなかったのですが、抜粋だということで他に何かあるんでしょうね。 私は、 val["select1"] がどういう結果を受け取れるのか良く分からなかったのですが、 （手持ちのIE6じゃエラーになってしまった。） これがあやしいかもしれません。（Ajaxか何かの記述方法のような気もします。） 前と同じようなサンプルですが。 名前のよこのInputを入力して、 一番上のInputを入れて、送信ボタンを押すと、1.htmが、 住所のよこのInputを入力して、 一番上のInputを入れて、送信ボタンを押すと、2.htmが、 表示されるサンプルです。 var v;はfanctionの外で定義しているので共通扱い。 functionの中で定義すると、他のfunctionから参照できません。 <SCRIPT LANGUAGE="JavaScript"> var v; </SCRIPT> <SCRIPT LANGUAGE="JavaScript"> function test1() {if(v == 1){・・・}・・・} </SCRIPT> と分けても大丈夫みたい。 ★サンプル <html> <head> <meta http-equiv="content-type" content="text/html; charset=shift_jis"> <title></title> <SCRIPT LANGUAGE="JavaScript"> var v; function test1() { /* alert(v); */ if(v == "1") {document.all.item("FM01").action = "1.htm"} else {document.all.item("FM01").action = "2.htm"}; } function test2() { v=1; } function test3() { v=2; } </SCRIPT> </head> <body> <INPUT id="CHG" type="text" onblur="test1()"> <form id="FM01" method="POST" action=""> <div>名前：<input type="text" name="NAME" onblur="test2()"></div> <div>住所：<input type="text" name="ADDR" onblur="test3()"></div> <input type="submit" value="送信"> <input type="reset" value="取消"> </form> </body> </html>
その他の回答 (2)
- Siegrune
- ベストアンサー率35% (316/895)
>javascriptで＃パターン１＃の対応をすると、fire fox,chromeではどうにかうまくいくのですが、 >IEでうまくいかずに頓挫しております。 IE6で、クライアント上のhtmファイルで以下を試してみただけですが、 うまく1.htmと2.htmとそれぞれ呼び出されますが。 どんなソースか書いてもらうとわかるかも。 <html> <head> <meta http-equiv="content-type" content="text/html; charset=shift_jis"> <title></title> <SCRIPT LANGUAGE="JavaScript"> function test1() { if(document.all.item("CHG").value == "1") {document.all.item("FM01").action = "1.htm"} else {document.all.item("FM01").action = "2.htm"}; } </SCRIPT> </head> <body> <INPUT id="CHG" type="text" onblur="test1()"> <form id="FM01" method="POST" action=""> <div>名前：<input type="text" name="NAME"></div> <div>住所：<input type="text" name="ADDR"></div> <input type="submit" value="送信"> <input type="reset" value="取消"> </form> </body> </html>
お礼
検証いたしました。 残念ながら結果は同じ（IEだと動かず、他だと動く）でした。 ただサンプル単独では試していないので、別の要因（既存のソース）かもしれない とも思ってます。 引き続きアドバイスをいただいておりますが、成否を問わず感謝いたします。
補足
ありがとうございます。 これから内容を精査して、試してみます。 自分の方の作ったソースは、該当箇所だけ抽出するとこんな感じです。 escapeをjavascript中で行うと文字化けから回避できなかったのでonsubmit中の動作に入れております。 ＊＊ <SCRIPT LANGUAGE="JavaScript"> <!-- function check_tem(){ if(val["select1"] == 2){ document.form1.action="./page504.html#sh"; } document.form1.action="./page503.html#sh"; } ; document.form1.submit() ; } --> </script> <form name="form1" id="form1" onsubmit="this.name.value=escape(this.coname.value);check_tem()";return false> <input type="text" name="name" value=""> document.write("<input type='hidden' name='select1' value='",val["select1"],"' />"); <input alt="次へ進む" src="/img/next.jpg" type="image" name="submit" onMouseover="this.src='/img/next_f2.jpg'" onMouseout="this.src='/img/next.jpg'"> </form>
JQuery といったJavaScript ベースのアーキテクチャがあります。ブラウザ間の動作の違いを可能な限り吸収してくれて、実装上でその事をあまり意識しないですみます。 JavaScript でイチから実装すると大変な作業ですから、ぜひお試しください。こういう代物はいろんなのが出ていますが、だいたい基本的な機能はどれも同じです。JQuery は日本語サイトや実装例もあるので比較的導入は楽だと思います。
お礼
ご相談に乗っていただき感謝いたします。 結果まだJQueryは採用していないのですが、今後のために大変参考になりました。 どうもありがとうございます。
補足
どうもありがとうございます。 JQueryは名前は何度も聞いていたのですが、 敷居が高い（スキル的に・環境的に）と思っていたので敬遠していました。 要約サイトなども拝見するに、結構いろいろなことがそこまで難易度高くなくできそうなので、Siegruneさんの対応を試した後、じっくり対応してみたいと思います。
お礼
どうもありがとうございます。 結局ソースはうまく動きました（未だになぜ動くようになったか解明できていないのですが） 親切にご相談に乗っていただき感謝しております。
補足
どうもありがとうございます。 これからこちらの方法試してみます。 valについてですが、これは別のJSでして、submitしてきたデータを触る関数という認識です。 *** val = new Array(); vals = document.location.search; vals = vals.substring(1,vals.length); vals = vals.split("&"); for (i in vals) { a = vals[i].split("="); val[a[0]] = unescape(unescape(a[1])); }