外部.jsの内容を一部置き換えて読み込む方法

このQ&Aのポイント
  • 外部.jsの特定の箇所を置き換える方法について教えてください。
  • index.htmlにAAA.jsを読み込ませる際、一部のソースコードを変更してフォームを送信する方法をご教示ください。
  • AAA.jsで指定されているp-123.htmlをp-456.htmlに置き換えてフォームを送信する方法はあるのでしょうか?
回答を見る
  • ベストアンサー

外部.jsの内容を一部置き換えて読み込む方法

お世話になります。 index.htmlに AAA.js という外部.jsを読み込ませてフォーム送信させようとしています。 AAA.jsには document.write("<INPUT NAME=\"return_url\" TYPE=\"hidden\" VALUE=\"http://www.my-site.com/p-123.html\"><INPUT NAME=\"to_do\" TYPE=\"hidden\" VALUE=\"touroku\"><input type=\"submit\" name=\"comm1\"/>" value=\"書き込む\""); というソースが入っており、 index.htmlには <INPUT NAME="return_url" TYPE="hidden" VALUE="http://www.my-site.com/p-456.html"> というタグが含まれています。 この場合、1組の<form></form>内に、同じ「return_url」で、片や p-123.html、片や p-456.html と、矛盾する2つの指定をしてしまっていることになりますから、これではフォームが成り立ちません。 都合により、このindex.htmlの<form></form>内にはどうしても AAA.js を読み込ませなければならないのですが、「return_url」だけはp-456.html に書き直してフォームを送信しなければなりません。 AAA.jsは私が作ったものではなく、他ページでも読み込むので、AAA.js は<INPUT NAME=\"return_url\" TYPE=\"hidden\" VALUE=\"http://www.my-site.com/p-123.html\">という記述を外すことも他のソースを付け加えることも出来ないのですが、 index.html側に何か手を加えることで、この AAA.js で指定されているp-123.htmlをp-456.html に置き換えてフォームを送信するようにすることは出来ないでしょうか? 方法をご存知の方がいらっしゃいましたら、どうかよろしくお願い致します。

  • R4-D4
  • お礼率100% (81/81)

質問者が選んだベストアンサー

  • ベストアンサー
  • Ogre7077
  • ベストアンサー率65% (170/258)
回答No.1

AAA.js を実行させた後に、フォーム内の入力要素の値を書き換える では駄目でしょうか? <script src=AAA.js></script> <script> var 対象要素 = 対象フォーム.elements['return_url']; var 対象要素を上書き = function(e){ e.value = 'p-456.html' }; if (対象要素.item) { Array.prototype.slice.apply(対象要素).forEach(対象要素を上書き); } else { 対象要素を上書き(対象要素); } </script>

R4-D4
質問者

お礼

ご回答ありがとうございました。 「対象要素を上書き」というのが、要するに私が「こんなことって出来ないのかな」と思っていた部分だったのですが、頂いたご回答のお陰でやっぱり出来るんだなと判りました。 具体的な書き方がわからなくて、改めて検索して色々なサイトを見てみるうちに、なんとなく出来そうな感じになってきました。 どうもありがとうございました。

その他の回答 (1)

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.2

よくわかってませんが… AAA.jsがご提示の通りdocument.writeで要素を追加しているのなら、その直後にスクリプトで  var inps = document.getElementsByTagName("input");  var inp = inps[inps.length-3]; とすることで、ご指定の要素を取得できます。  要素ごと削除してしまうとか、desableにするとかいろいろ方法はあると思いますのでご自由に。

R4-D4
質問者

お礼

ご回答ありがとうございました。 すみません、私のレベルでは、教えて頂いた部分でどのように要素が抜き出されているのかちょっと理解しきれず、その後をどう処理したらいいかを考えることが出来ませんでした。 #1でOgre7077さんに教えて頂いたスタイルでいじってみようと思います。

関連するQ&A

  • 読み込む外部スクリプトをセレクトボックスを使って選べないでしょうか?

    お世話になります。 フォーム内に配置した、1から5までの数字を選べるセレクトボックスを使って、そのフォーム内に読み込む.jsファイルを選択することは出来ないでしょうか? 外部ファイルには、UsualSet.js、EmergencySet.js、PauseSet.jsなどがあって、そのスクリプトファイルの中身は document.write("<input name=\"youbi\" type=\"hidden\" value=\"土曜\"><input name=\"codenumber\" type=\"hidden\" value=\"732\"><input name=\"busho\" type=\"hidden\" value=\"経理\">"); とかいった感じになっています。 つまり、セレクトボックスで何番を選ぶかによって、CGIに渡す値を$youbiと$codenumberと$bushoとの3つ全ていっぺんに変更出来るようにしたい訳です。 しかし、そのセレクトボックスにどういう仕掛けをしたら良いかわからなくて困っています。 まさか、 <FORM ACTION="pro.cgi" METHOD="POST">  <select name="kazu">   <option value="<script language="javascript" src="UsualSet.js>" selected>1</option>   <option value="<script language="javascript" src="EmergencySet.js>" >2</option>   <option value="<script language="javascript" src="PauseSet.js>" >3</option>   <option value="<script language="javascript" src="MorningSet.js>" >4</option>   <option value="<script language="javascript" src="FulleSet.js>" >5</option>  </select>   <input type="hidden" name="kaijou" value="22890">  <input type="hidden" name="boxnumber" value="62">  <input type="submit" name="Submit" value="送信"> </FORM> なんてわけに行かないですもんね。 どうしたらいいかおわかりの方がいらっしゃいましたら、どうかよろしくお願い致します。

  • textareaの内容が一部の携帯で無効に

    以下のように記述して投稿フォームを作っています。 <form action="******.cgi" method="post" enctype="" > <input type="hidden" name="mode" value="prev"> <input type="hidden" name="name" value="">       ・       ・       ・ <textarea cols="55" rows="8" name="CONTENTS"></textarea>       <input type="submit" value="送信" class="btn"> </form> なぜか一部の携帯で<textarea>内の文字列が送信されません。 name属性が大文字なのが原因でしょうか? formのenctype属性が空欄だからでしょうか。 ちなみに問題を確認した端末はAUの京セラK002です。

  • チェックボックスが1つ以上チェックされたかチェックしたい

    以下のフォームで、 p_cdのチェックボックスが1つ以上選択されたかチェックしたいのですが、良い方法ございますでしょうか? <form name='test'> <input type="hidden" name="p_name[]" value='xx'> <input type="checkbox" name="p_cd[]" value='1'> <input type="hidden" name="p_name[]" value='yy'> <input type="checkbox" name="p_cd[]" value='1'> </form>

  • 1つのformで複数のactionを実行できますか?

    フォーム内に商品の購入ボタンがあります。同じフォーム内に商品名でグーグルのサイト内を検索させるボタンを設置し、横に並べることは可能ですか? フォームの入れ子はよくないようなので、検索をJava scriptでできればよいのですが・・・ スタイルシートではデザイン上無理でした。 <form id="fm" name="fm" action="URL" method="POST"> <input type="hidden" name="shouhinmei" value="商品名"> <input type="hidden" name="kakaku" value="500"> <input type="image" src="kounyuu.gif value="購入"> <form method=get action="http://www.google.co.jp/search"> <input type=hidden class="q" name=q value="商品名"><input type=hidden name=ie value=UTF-8><input type=hidden name=oe value=UTF-8><input type=hidden name=hl value="ja"><input name=btnG type="image" src="検索.gif value="検索"><input type=hidden name=sitesearch value="サイトのURL"></form> </form> </form> +----+  +----+ |購入|  |検索| +----+  +----+

  • メールフォームの内容を送信者にも控えがとれるようにしたい

    下記の件で困っています。 HTMLの中で、メルフォを設けました。 <form method=post action="フォームデコードサービス"> <input type=hidden name="_mailto" value="***@*****.ne.jp"> <input type=hidden name="_subject" value="件名"> <input type=hidden name="_location" value="http://戻りURL.htm"> <table border="0" cellpadding="5" cellspacing="0" width="900"> <tr> <td width="150">氏名</td> <td colspan="2" width="700">     <input type="text" size="30" name="氏名"></td> </tr> ・ ・ ・ <p> <input type="submit" value="submit"> <input type="reset" value="reset"> </p> </form> 最初はデコードサービスを使わなかったのですが、Macから送信されるデータが文字化けする為、使うことにしました。 しかし、そうすると、送信者に送信内容が残らなくなってしまいました。 送信者の手許にもコピーが残るようにしたいので、お知恵を拝借できれば幸いです。 よろしくお願い致します。

  • フォームタグについて

    二つのフォームタグを一つのボタンで送信したいのですが、可能でしょうか? <form action="http://aaa/" method="post"> <input type="hidden" name="comment" value="テキスト "/> <input type="hidden" name="mode" value="com_w" /> <input type="hidden" name="no" value="1" /> <input type="submit" value="登録" /></form> <form action="http://bbb/" method="post"> <input type="hidden" name="comment" value="テキスト "/> <input type="hidden" name="mode" value="com_w" /> <input type="hidden" name="no" value="2" /> <input type="submit" value="登録" /></form> 同じデータをもっているフォームですが、送信するページが別々になっています。 この二つのフォームを一つの送信ボタンで送信できますでしょうか? 色々と調べましたがわかりません。 よろしくお願いいたします。

  • 名無しformの操作

    以下のような、元々名前のないformが複数ある場合にボタンイベントで発生した共通のtest()関数内で処理を行う場合、どのフォームか識別できる方法はあるのでしょうか? テスト1、をクリックした場合、テスト1のフォームの操作を行いたいです。 <script ....... function test(???) { document.どのフォームかわからない.action="/index.cgi"; document.どのフォームかわからない.a.value="1"; document.どのフォームかわからない.submit(); } </script> <form> <input type="hidden" name="a" value=""> <input type="button" value="テスト1" onclick="javascript:test(???)"> </form> <form> <input type="hidden" name="a" value=""> <input type="button" value="テスト2" onclick="javascript:test(???)"> </form> <form> <input type="hidden" name="a" value=""> <input type="button" value="テスト3" onclick="javascript:test(???)"> </form>

  • フォーム内の値の指定方法

    JavaScriptで、 フォーム内の値を指定するとき、どちらの記述がwebの標準として正しいのでしょうか? document.form1.aaa.value form1.aaa.value  【フォーム】 <from name="form1"> <input type="textbox" name="aaa"> </form>

  • フォームメールでURL送信時、存在しないURLの入力を拒否したい

    xmlhttprequest.comにあるxmlhttprequest.jsを使って、 会社の問い合わせページとして、URLやコメント等を入力して 送信できるメールフォームのページを作っています。 存在しないURLを入力した場合はエラーを返すようにしたのですが、 今度は、メールフォームのコマンドが実行されなくなって しまいました。 どこがおかしいのかご教示いただきたく。 <html><head><title>お問い合せ</title> <script type="text/javascript" src="xmlhttprequest.js"></script> <script type="text/javascript"><!-- xhobj = new XMLHttpRequest(); LoadFlg = 0; function init(){ } function go(){ document.form2.Url.value = "http://www.google.co.jp/" + document.form1.Url.value; document.form2.comment.value = document.form1.comment.value; if ( all_check(document.form1) ){ document.form2.submit(); } } function all_check(form){ if( !(nullCheck(form.Url,"URLを")) ){ return false; } if( !(nullCheck(form.comment,"問合せ内容を")) ){ return false; } if( !(stateCheck(form.Url)) ){ return false; } return true; } function alert_focus(obj,str){ alert(str + "入力してください。"); obj.focus(); } function nullCheck(obj,str){ if (obj.value == "" || obj.value == null){ alert_focus(obj,str); return false; }else{ return true; } } function stateCheck(obj){ if(xhobj == null){ alert("お使いのブラウザは対応していません。"); return false; } if(LoadFlg == 0){ LoadFlg = 1; xhobj.onreadystatechange = handleXHRequest; xhobj.open("GET", "http://www.google.co.jp/"+ obj.value, true); xhobj.send(null); } else { LoadFlg = 0; xhobj.abort(); return true; } } function handleXHRequest(){ if(xhobj.readyState == 4){ if(LoadFlg == 1){ if(xhobj.status != 200){ form1.state.value=xhobj.status; alert("存在しているURLを入力してください。"); return false; } xhobj.abort(); LoadFlg = 0; } return true; } } // --></script> </head> <body onLoad="init();"> <form name="form1" id="form1" method="get" action="javascript: go();"> ページURL:http://www.google.co.jp/<input name="Url" id="Url" type="text" value=""><br> 用件:<textarea name="comment"></textarea><br> <input type="reset" value="取消"><input type="submit" value="送信"><br> ステータス確認用:<input name="state" type="text" value=""> </form> <form name="form2" id="form2" method="post" action="http://URL/mail/"> <input type="hidden" name="subject" value="問合せメール"> <input type="hidden" name="Url" value=""> <input type="hidden" name="comment" value=""> </form> </body></html>

  • 複数FORMの一括実行について

    通常であれば同一サイト内に下記のソース(フォーム)が入るのですが、 これを改良しサイト上で希望の送信先をチェックボックスで選択し一回の操作で複数のcgiを実行したく思います。 良いcgiがあれば教えてください。 又は改造ができるcgi、修正方法を分かりましたらお教え願います。 サイトA <form action="https://aaa.cgi" method="post"> <input type="hidden" name="名前" value="name"> <input type="hidden" name="メール" value="mail"> <input name="Submit" type="submit" value="送信"> </form> サイトB <form action="https://bbb.cgi" method="post"> <input type="hidden" name="名前" value="name"> <input type="hidden" name="メール" value="mail"> <input name="Submit" type="submit" value="送信"> </form> サイトC <form action="https://ccc.cgi" method="post"> <input type="hidden" name="名前" value="name"> <input type="hidden" name="メール" value="mail"> <input name="Submit" type="submit" value="送信"> </form>

    • 締切済み
    • CGI

専門家に質問してみよう