- ベストアンサー
FORMタグのtarget属性に値を書込む方法とは？
- FORMタグのtarget属性に値を書き込む方法について教えてください。送信ボタンを押すとtargetの値を取得できず、javascriptエラーが発生します。具体的には、「引数は無効です」と表示されます。make_newwin関数を実行しようとしていますが、うまくtargetの値を取得できません。targetには親ウィンドウの名前を指定したいです。何か良い方法があれば教えてください。
- FORMタグのtarget属性に値を書き込む方法について教えてください。送信ボタンを押すとtargetの値が取得できず、javascriptエラーが発生します。「引数は無効です」というエラーメッセージが表示されます。make_newwin関数を実行しようとしていますが、targetの値をうまく取得できません。targetには親ウィンドウの名前を書き込みたいです。どうすればよいでしょうか。
- FORMタグのtarget属性に値を書き込む方法を教えてください。送信ボタンを押すとtargetの値を取得できず、javascriptエラーが表示されます。「引数は無効です」というエラーメッセージが表示される状況です。make_newwin関数を実行しようとしていますが、うまくtargetの値を取得できません。targetには親ウィンドウの名称を書き込む必要があります。解決策を教えてください。
- sara555
- お礼率69% (137/197)
- JavaScript
- 回答数4
- ありがとう数4
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
> ■親ウィンドウのHTMLで、target="ko"と限定して > ありますよね。もし、親ウィンドウも２つ表示されて > いて、子ウィンドウも２つ表示されている場合、 > それぞれの処理をさせるためには、どうしたら > 良いでしょうか？今の状態ですと、子ウィンドウ > が、上書きされてしまいます。 そのような場合、それぞれの親が自分の子に、他の子とは違う名前を付けなければなりません。となると HTML では対処できないので、JavaScript で設定するようにします。 また、No.3 のサンプルでは親の名前も固定なので、このままでは子から親への送信にも問題があるかも知れません。ですから、親の名前もウィンドウごとにユニーク（一意的）な名前になるようにした方が良さそうです。 ユニークな名前を作るには、ミリ秒単位で値が変わる Date オブジェクトを利用するとよいでしょう。Date オブジェクトの getTime メソッドは、1970年1月1日0時0分0秒からの経過時間（ミリ秒）を返します。 以上を踏まえ、No.3 の親ウィンドウのサンプルを書き換えてみます。 ■親ウィンドウのHTML（その２） <html> <head> <title>親</title> <script type="text/javascript"> <!-- // 自分に名前を付ける window.name = (new Date()).getTime(); ★変更：親の名前設定 // FORM送信で開くウィンドウのスタイルを指定するための関数 function make_newwin(f) { f.target = window.name + "_ko"; ★追加：子の名前設定※ var w = window.open("about:blank", f.target, "スタイル設定"); w.focus(); } //--> </script> </head> <body> <form action="/cgi-bin/test-check.cgi" method="post" onSubmit="make_newwin(this)"> ★削除：target="ko" は不要 <input type="submit"> </form> </body> </html> ※親の名前がユニークなので、「親の名前+"_ko"」とするだけで子もユニークになります。 子の名前も親と同じように Date オブジェクトで設定してもよかったのですが、こちらの方が簡単かつ安全なのでこのようにしました。
その他の回答 (3)
- leaz024
- ベストアンサー率75% (398/526)
> なぜ、window.openを使用しなければならないのかというと、 > 以下で質問した際に、この方法でうまくいきました。 それぞれの質問を読みましたが、親→子、子→親の両方の質問が混じってますよね？ 質問される際は、どちらのどの処理で困っているのか明記されるとよいと思います。 で、親から子を開く時には、ウィンドウスタイルの指定などのために window.open することはありますが、子から親に向けて送信する時には、既にウィンドウがあるので window.open は必要ありません。 今、質問されているのは、子ウィンドウから親ウィンドウへの送信ですよね？ということは window.open を使う必要はないということです。 なお、やはり私が試した限りでは「引数が無効」のエラーは発生しません。 親ウィンドウのURLと子ウィンドウのURLで、ドメインが違うということはありませんか？ 本件については未確認ですが、異なるドメインのウィンドウを操作しようとすると、エラーとなることがあります。 ちなみに、 > <FORM>で、渡している項目数が多すぎて、このような結果になりました。 「渡す項目」って INPUT とか SELECT とかのことですよね？これの数が多すぎて問題になるということは、通常あり得ません。 どこか別のところに問題があると考えて間違いないでしょう。 それと、q=990988 の方でちょっと気になったことがあり、そちらにも書き込みましたのでご確認ください。 No.3 の補足で挙げられた質問などから考えられる、全体のサンプルを簡単に書いてみましたので、ご参考ください。 ■親ウィンドウのHTML <html> <head> <title>親</title> <script type="text/javascript"> <!-- // 自分に名前を付ける window.name = "oya"; // FORM送信で開くウィンドウのスタイルを指定するための関数 function make_newwin(f) { var w = window.open("about:blank", f.target, "スタイル設定"); w.focus(); } //--> </script> </head> <body> <form action="/cgi-bin/test-check.cgi" method="post" target="ko" onSubmit="make_newwin(this)"> <input type="submit"> </form> </body> </html> ■子ウィンドウのHTML（test-check.cgiで出力） <html> <head> <title>子</title> <script type="text/javascript"> <!-- // 親ウィンドウに対して送信し、自分は閉じるための関数 function send2opener(f) { if (!opener || opener.closed) f.target = '_blank'; else if (opener.top.name) f.target = opener.top.name; else f.target = opener.top.name = 'dummy_name'; f.submit(); window.close(); return false; } //--> </script> </head> <body> <form action="/cgi-bin/test_new.cgi" method="post" onSubmit="return send2opener(this)"> <input type="submit"> </form> </body> </html> ※JavaScriptコードのインデントに全角スペースを使用していますので、コピーして試される場合はタブなどに置き換えてください。
補足
回答有難うございます。サンプルのソースまで 書いていただいて、大変助かります。 説明のつじつまが合わなくて、本当申し訳ありません。上のソースでうまくいったのですが、 あと1つ教えていただきたいのです。 ■親ウィンドウのHTMLで、target="ko"と限定して ありますよね。もし、親ウィンドウも２つ表示されて いて、子ウィンドウも２つ表示されている場合、 それぞれの処理をさせるためには、どうしたら 良いでしょうか？今の状態ですと、子ウィンドウ が、上書きされてしまいます。 教えて下さい。
- leaz024
- ベストアンサー率75% (398/526)
> 親 → 子 → 親（更新）と言う形で処理をしたいのですが、 > この記述は、子 → 親（更新）に作成したものですが。 はい、私もそのつもりで回答したのですが・・・。 # それともどこか認識のずれがあるでしょうか？ > 以下のように、targetを表示してみたところ、うまく表示できていました。 > alert(f.target) そうですよね、f.target は document.test.target=opener.window.top.name; で取得しているので、これがちゃんと表示されないと“それ以前の問題”ということになってしまいます。 > var w = window.open('about:blank', f.target); > の行で、「引数が無効です」と表示されます。 > 解決する方法はないでしょうか？ これなんですが、私の環境（WinXP＋IE6）ではエラーが起きないんですよ。 で、どうせ f.target である親ウィンドウは既に開いているのだから、わざわざ window.open せずに、FORM の target のみを変更する方法を No.1 で書いたわけです。 # というか、targetは指定してあるのだから、単純に window.open しないだけで解決するような気もします。 もし No.1 の方法を試されていないのでしたら、一度試してみてもらえますか？それでもエラーが出るようでしたら、再度補足ください。 また、もし質問の make_newwin のコードが主要部の抜粋だとすれば、全容を示してもらえると何か分かるかも知れません。
補足
回答有難うございます。 とても、わかりにくい説明で申し訳ありません。 なぜ、window.openを使用しなければならないのかというと、 以下で質問した際に、この方法でうまくいきました。 http://oshiete1.goo.ne.jp/kotaeru.php3?q=949297 http://oshiete1.goo.ne.jp/kotaeru.php3?q=975293 ここまでは、ウィンドウ名を固定にしていたので、 うまくいっていたのですが、この質問をしたところ、 難しくなり、今質問させていただいてる件に至ります。 http://oshiete1.goo.ne.jp/kotaeru.php3?q=990988 <FORM>で、渡している項目数が多すぎて、このような結果に なりました。 説明不足でもうしわけありません。 良かったら教えて下さい。
- leaz024
- ベストアンサー率75% (398/526)
要するに、opener.top（opener.window.top と同じ）に対して送信したい、ということですよね？ だったら送信時に name を取得して target に設定すればよいだけで、事前に取得したり、window.open したりする必要はありません。 <script type="text/javascript"> <!-- function setTarget(f) { // このHTMLが直接開かれた場合（openerがundefined）や // 親ウィンドウが既に閉じられた場合には _blank にする。 if (!opener || opener.closed) f.target = '_blank'; // opener.top.name が設定されていればそれを使う。 // ※topウィンドウの場合、普通は設定されていない。 else if (opener.top.name) f.target = opener.top.name; // name が設定されていない場合は、強制的に設定する。 else f.target = opener.top.name = 'dummy_name'; close(); } // --> </script> <FORM action="/cgi-bin/test.cgi" method="post" onSubmit="setTarget(this)"> ※下記の部分は必要ありません。 <script> document.test.target=opener.window.top.name; </script>
補足
素早い回答、感謝しております。 親 → 子 → 親（更新）と言う形で処理をしたいのですが、 この記述は、子 → 親（更新）に作成したものですが。 以下のように、targetを表示してみたところ、うまく表示できていました。 var w = window.open('about:blank', f.target); の行で、「引数が無効です」と表示されます。 解決する方法はないでしょうか？ function make_newwin(f) { alert("送信しました。" + document.test.target) alert(f.target) var w = window.open('about:blank', f.target); w.focus(); window.close(); }
お礼
とてもわかり易い回答を書いていただき、有難うございました。 先程、補足した件ですが、私の勘違いでうまくいきませんでしたが、 無事、できるようになりました。有難うございました。
補足
丁寧でわかりやすい回答有難うございます。 教えていただいた方法で行ってみたところ、 うまく動作することができました。 原因は、ENTERキーを無効にしたくて、 <input type="submit">と記述していなくて、 <input type="button" onclick="subm()"> として、SUBMITをjavascriptで動かそうとして いたので、うまくいきませんでした。 また、まだうまく言ってないところが ありまして、上記の部分でやはり、ENTERキーで SUBMITするのをやめたいのですが、それは 無理な話でしょうか？ それと、「引数が無効」のエラーは発生します。 なぜかというと、教えていただいたとおり、 親ウィンドウのURLと子ウィンドウのURLで、 ドメインが違うので、どうしてもエラーが発生 します。解決する方法があれば、教えて下さい。