• ベストアンサー

受け取ったパラメータが文字化け

お世話になります、JavaScript初心者です。 GET送信によるパラメータを他ページに受け渡して表示をさせると 各ブラウザで以下のような現象が起こります。 □Windows ・IE8：正常に表示 ・IE7：正常に表示するがエラーが表示される （エラー内容：「'document.form1.courseno.value'はNullまたはオブジェクトではありません。」） ・IE6：表示されずにエラーが表示される ・FF/chrome：文字化け □Macintosh ・safari/FF：文字化け 様々なサイトのソースを参考に自分なりに書いたのですが、 初心者なものでどこが原因なのか見当もつきません。 以下に該当するソースを明記いたしますので、ご教授いただければ助かります。 /* ↓↓↓パラメータを渡すページ↓↓↓ */ <script type="text/javascript"> function send() { var courseno=course=day=price=""; /* コード変換 */ courseno=escape(document.form1.courseno.value); course=escape(document.form1.course.value); day=escape(document.form1.day.value); price=escape(document.form1.price.value); } </script> <body> <form action="#" method="get" name="form1"> <p><a href="get.html?courseno=4074&course=水晶岳岳&day=12月25日&price=93,000円" onclick="send();">お申込み</a></p> </form> </body> /* ↑↑↑パラメータを渡すページ↑↑↑ */ /* ↓↓↓パラメータを表示させるページ↓↓↓ */ <script type="text/javascript"> function pramWrite() { var pram=location.search; /* パラメータがない時は処理しない */ if (!pram) return false; /* 先頭の「?」を削除して「&」で分割し配列へ */ pram=pram.substring(1); var pair=pram.split("&"); var i=temp=""; var key=new Array(); for (i=0; i < pair.length; i++) { /* 配列の値を「=」で分割 */ temp=pair[i].split("="); keyName=temp[0]; keyValue=temp[1]; /* キーと値の連想配列を生成 */ key[keyName]=keyValue; } var courseno=course=day=price=""; courseno=unescape(key["courseno"]); course=unescape(key["course"]); day=unescape(key["day"]); price=unescape(key["price"]); document.form1.pram.value="コースNO："+courseno+"\n"+"コース名："+course+"\n"+"出発日："+day+"\n"+"旅行代金："+price+"\n"; } </script> <body onload="pramWrite()"> <p>受け取ったパラメータを表示</p> <form name="form1" action="#"> <textarea name="pram" cols="40" rows="4" readonly="readonly" wrap="off" style="border:0;overflow:visible"></textarea> </form> </body> /* ↑↑↑パラメータを表示させるページ↑↑↑ */ 以上、よろしくお願いいたします。

この投稿のマルチメディアは削除されているためご覧いただけません。

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

  • ベストアンサー
回答No.1

ごめん！もうねむくて、かいとうではないのだけれど var courseno=course=day=price=""; って、coursenoいがいは、ぐろーばるだよ！ unescape()は廃止への・・・・ なので encodeURIComponent()とか decodeURIComponent() に。 https://developer.mozilla.org/ja/Core_JavaScript_1.5_Guide/Predefined_Functions/escape_and_unescape_Functions <form>のnameはidに。 document.form1.pram.valueを document.forms['form1'].elements['pram'].valueとかに

kaseee
質問者

補足

回答どうもありがとうございます。 指摘いただいた各グローバル変数を「var course="";」という風にそれぞれローカル変数にいたしました。 各コード変換の箇所も 「var courseno=encodeURIComponent(courseno);」 「courseno=decodeURIComponent(key["courseno"]);」 とそれぞれ変更したところ、無事に表示されました！！！ ただIE6だけはエラーが表示されるのですが、 これは複数のIEを共存させる「Multiple_IE」のせいなのでしょうか？ それとも今回のJavaScriptに問題があるのでしょうか？ もし原因などが分かるようでしたら指摘してもらえると助かります。

その他の回答 (1)

回答No.2

> <a href="get.html?courseno=4074&course=水晶岳岳&day=12月25日&price=93,000円" JavaScriptとか関係有りません。 URLエンコードをブラウザに任せる場合は、「（UTF-8やShift_JISなどの）文字コード不明データ」として、文字コードの変換を行って下さい。 <a href="get.html?%48">などとあらかじめ%nn形式のURLエンコードをしておけば、 そのまま送信されますので文字コードの判別が不要になります。

kaseee
質問者

お礼

回答どうもありがとうございます。 そうですね、あらかじめURLエンコードしておけば良いのですが、 リンク設定をする人たちのスキルの問題があり、 分かりやすくするため日本語でパラメータをと考えております。 他にもっと良い方法があるのかもしれませんが、 なにぶんJavaScript初心者なもので、この方法しか思いつきませんでした。 また機会があればアドバイス宜しくお願いします。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • ジャバスクリプトで自動計算表を作ったのですが、ＩＥでは動くのですが、フ

    ジャバスクリプトで自動計算表を作ったのですが、ＩＥでは動くのですが、ファイヤーフォックスでは動きません。どこに不具合があるのでしょうか？ 問題のフォームはこちらです http://tatamitai.com/form1-11.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML lang="ja"> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <TITLE>メールフォーム</TITLE> <META http-equiv="Content-Style-Type" content="text/css"> <META name="description" content="メールフォーム"> <META name="keywords" content="メルマガ,ホームページ,サイト制作"> <script type="text/javascript"> <!-- function keisan(){ // 設定開始 // 商品1 var price1a = 3680; var price1b = document.form1.格安コース：数.selectedIndex * 1; // 単価を設定 var price1c = document.form1.格安コース：工期等課金.value * 1; // 単価を設定 var price1d = document.form1.格安コース：柄.value * 1; // 単価を設定 var price1e = document.form1.格安コース：シート.value * 1; // 単価を設定 var price1f = document.form1.格安コース：乾燥.value * 1; // 単価を設定 var total1 = document.form1.格安コースの小計.value = (price1a + price1c + price1d + price1e + price1f) * price1b; // 小計を表示 // 商品2 var price2a = 4900; var price2b = document.form1.標準コースA：数.selectedIndex * 1; // 単価を設定 var price2c = document.form1.標準コースA：工期等課金.value * 1; // 単価を設定 var price2d = document.form1.標準コースA：柄.value * 1; // 単価を設定 var price2e = document.form1.標準コースA：シート.value * 1; // 単価を設定 var price2f = document.form1.標準コースA：乾燥.value * 1; // 単価を設定 var total2 = document.form1.標準コースAの小計.value = (price2a + price2c + price2d + price2e + price2f) * price2b; // 小計を表示 // 合計を計算 var total = total1 + total2; // 設定終了 document.form1.合計.value = total; // 合計を表示 } // --> </script> <STYLE type=text/css> <!-- A:link { FONT-SIZE: 10pt; COLOR: #ff0000; TEXT-DECORATION: none ;} A:visited { FONT-SIZE: 10pt; COLOR: #ff0000; TEXT-DECORATION: none ;} A:active { FONT-SIZE: 10pt; COLOR: #ff0000; TEXT-DECORATION: none ;} A:hover { FONT-SIZE: 10pt

  • Javascript 足し算

    ホームページ用見積もりフォーム 商品の値段を合計する。 一個ずつ足しての計算で処理してるのですが、商品がかなりの数になりそうです。 エクセルのSUMのように商品１から商品1000までを計算する関数を教えていただきたいと思っています。 JavaScriptは外部参照しています。 以下がJavaScriptのコードになります。 function keisan(){ // 設定開始 var tax = 5; // 消費税率 // 商品1 var price1 = document.form1.goods1.options[document.form1.goods1.selectedIndex].value; // 商品2 var price2 = document.form1.goods2.options[document.form1.goods2.selectedIndex].value; // 商品3 var price3 = document.form1.goods3.options[document.form1.goods3.selectedIndex].value; // 合計を計算 var total1 = parseInt(price1) + parseInt(price2) + parseInt(price3); // 設定終了 document.form1.field_total1.value = editNumberSeparated(total1); // 合計を表示 var tax2 = Math.round((total1 * tax) / 100); document.form1.field_tax.value = editNumberSeparated(tax2); // 消費税を表示 document.form1.field_total2.value = editNumberSeparated(total1 + tax2); // 税込合計を表示

  • Javascript 計算後の３桁区切り

    ホームページ用見積もりフォームをJavascriptで自動計算 縦に長いページで一番下に計算結果を表示 ページをスクロールしても、何時でも計算結果が見られるように、別のウィンドウ（レイヤー）でページ内に表示。 以上までは出来ました。 最後に計算結果を３桁区切りで表示させたいのですが、上手く出来ません。 お知恵をお貸しくださいませ。 Javascriptは外部参照しております。 ３桁区切りのJavascriptを外部参照している同一のページに記入した方が良いか、別参照の方が良いかも教えていただければ幸いです。 以下がJavascriptのコードになります。 function keisan(){ // 設定開始 var tax = 5; // 消費税率 // 商品1 var price1 = document.form1.goods1.options[document.form1.goods1.selectedIndex].value; // 商品2 var price2 = document.form1.goods2.options[document.form1.goods2.selectedIndex].value; // 商品3 var price3 = document.form1.goods3.options[document.form1.goods3.selectedIndex].value; // 合計を計算 var total1 = parseInt(price1) + parseInt(price2) + parseInt(price3) ; // 設定終了 document.form1.field_total1.value = total1; // 合計を表示 var tax2 = Math.round((total1 * tax) / 100); document.form1.field_tax.value = tax2; // 消費税を表示 document.form1.field_total2.value = total1 + tax2; // 税込合計を表示 //右の窓に表示する金額 document.getElementById("display_account_amount").innerHTML = total1; document.getElementById("display_account_tax").innerHTML = tax2; document.getElementById("display_account_all").innerHTML = total1 + tax2; }

  • 計算結果を変数に代入

    とあるサービスの料金計算フォームを制作しています。 特定の場合のみ料金が割引されるので、if構文で条件分岐してみたところ、 計算結果（小計）にはうまく反映されるのですが、いくつかの小計を合計すると、 if構文で分岐する前の（つまり割り引き前の）値段で計算されてしまいます。 // 小計１ var total_01 = document.form_test.price_01.options [document.form_test.price_01.selectedIndex].value * document.form_test.goods_01.options [document.form_test.goods_01.selectedIndex].value + document.form_test.price_02.options [document.form_test.price_02.selectedIndex].value * document.form_test.goods_02.options [document.form_test.goods_02.selectedIndex].value ; // 小計１ document.form_test.F-total_01.value = total_01; // 小計１を表示 if (document.form_test.price_01.options [document.form_test.price_01.selectedIndex].value != 0 && document.form_test.price_02.options [document.form_test.price_02.selectedIndex].value != 0) {document.form_test.F-total_01.value = total_01 - 500;} // 両方で-500 if (total_01 <= 0) {document.form_test.F-total_01.value = 0;} // 合計 var total_all = total_01 + total_02 + total_034; // 合計 document.form_test.F-total_all.value = total_all; // 合計を表示 小計を表示する <INPUT TYPE="text" NAME="F-total_01" VALUE="0"> に出てきた値を、そのまま次の計算に代入できれば 解決するのではないかと思うのですが、行き詰ってしまいました。 どうかアドバイスをよろしくお願いいたします。

  • JavaＳの追加計算

    function keisan(){ // 設定開始 var price1 = document.form1.kazu.value; // 合計を計算 if (price1 < 10000) { var total = parseInt(price1)*44/10000; } else { var total = parseInt(price1)*45/10000; } else if // 設定終了 document.form1.field_total.value = total; // 合計を表示 } // --> </SCRIPT> 上記に追加で*22/10000の計算を入れたいのですがどうしたらいいのですようか？　初心者なので申し訳ございませんがご教授お願い致します。

  • Netscapeだと文字化け！

    まずは下記のHTMLをご覧下さい。 <html> <head> <title>tes</title> </head> <SCRIPT LANGUAGE=JAVAScript> <!-- function cp_text( ) { document.fr_test.right.value = document.fr_test.left.value ; } function cp_text1( ) { document.fr_test.right.value = escape(document.fr_test.left.value) ; } function cp_text2( ) { var n = unescape(document.fr_test.right.value) ; document.fr_test.right.value = n; } //--> </SCRIPT> <body> <form name="fr_test"> テキスト１　<input type="text" name="left" size="10" maxlength="10"><BR> テキスト２　<input type="text" name="right" size="10" maxlength="10"><BR><BR> <input type="button" name="btn_tes" value="コピー開始" onclick="cp_text()"><BR> <input type="button" name="btn_bin" value="ﾃｷｽﾄ2をHEX変換" onclick="cp_text1()"> <input type="button" name="btn_bin" value="ﾃｷｽﾄ2をDEC変換" onclick="cp_text2()"> </form> </body> </html> ------------------------------------------------ 以上のように記述されたHTMLがあります。 これをNetscapeで起動させるとﾃｷｽﾄﾎﾞｯｸｽが２つ表示されます。 ここで「テキスト１」の方に(1)、(2)みたいなコード(ローマ字でしょうか？） これを入力させて下にある「コピー開始」ボタンを押すと テキスト２の方へ値がコピーされてしまうのですが、 ローマ字文字が文字化けしてしまいます。 これをＩＥで起動すると文字化けはおきないのですが。 これをNetscape上で文字化けを起こさずにコピーすることは できないのでしょうか？

    • ベストアンサー
    • HTML
  • 自動計算の合計金額を次ページで表示

    いつも『教えて！goo』を活用させていただきありがとうございます。 またお世話になます。 今回はJavascriptで自動計算させた合計金額を、別ページで表示させることで困っております。 同じページで合計金額の表示はでき、それを基にパラメータで引き渡そうとしているのですが、なかなかうまくいきません。 同じページで合計金額の表示のタグ構成は以下のとおりです。 ＜自動計算側ページ：index.html＞＝＝＝＝＝＝＝＝＝＝＝＝ <html> <head> <SCRIPT language="JavaScript"> <!-- function cal(f){ var price=0; for(var i=0;i<f.length;i++){ if(f[i].type=="radio" && f[i].checked) price+=parseInt(f[i].value); } f.price.value=price; } //--> </SCRIPT> </head> <body> <form> <p> <input type="radio" name="group1" value="30" />金：30円 <input type="radio" name="group1" value="20" />銀：20円 <input type="radio" name="group1" value="10" />銅：10円 </p> <p> <input type="radio" name="group2" value="400" />ダイヤモンド：300円 <input type="radio" name="group2" value="300" />サファイア：200円 <input type="radio" name="group2" value="200" />ルビー：100円 <input type="radio" name="group2" value="100" />アメジスト：100円 </p> <p> <input type="radio" name="group3" value="3000" />リチウム：3,000円 <input type="radio" name="group3" value="2000" />チタン：2,000円 <input type="radio" name="group3" value="1000" />白金：1,000円 </p> <hr /> <p><input type="button" value="合計金額を計算" onClick="cal(this.form)" /><br /> 合計：<input type="text" name="price" style="text-align:right" size="10" />円</p> </form> </body> </html> <p><input type="button" value="合計金額を計算" onClick="cal(this.form)" /><br /> 合計：<input type="text" name="price" style="text-align:right" size="10" />円</p> の箇所を<input type="submit" value="次ページで計算" />に書き換えて、 function cal(f){内に var pram="price="+price location.href="price.html?"+price; return false; を追記し、以上でテストすると ＜index.html?group1=30&group2=300&group3=1000#＞といった風に radioボタンのnameとvalueが付いてしまい＜price.html＞にリンクしません。 以下に＜合計金額表示ページ：price.html＞も明記させていただきますので 皆様には、大変ご迷惑をおかけしますが、何卒ご回答の程よろしくお願い申し上げます。 ＜合計金額表示ページ：price.html＞＝＝＝＝＝＝＝＝＝＝＝＝ <html> <head> <SCRIPT language="JavaScript"> <!-- function pramWrite() { var pram=location.search; if (!pram) return false; pram=pram.substring(1); document.form1.price.value=pram; } //--> </script> </head> <body onload="pramWrite()"> <form name="form1" action="#"> 合計：<input type="text" name="price" style="text-align:right" size="10" />円 </form> </body> </html>

  • evalで数値に変換してる筈なのですが・・・NaN

    今、JavaScriptを勉強中なのですが… Nanと言う表示が出てしまうと言う事は数値じゃないと言う事ですよね？ どうしても一人の力では脱出できませんのでお助けください！ どなたか是非ご教授よろしくお願いします。 var item=["N-01ネックレス","N-02ネックレス","EA-01イヤリング","KS-01携帯ストラップ"]; var g=[10,15,20,30]; var p=[1000,800,600,600]; function n01(){ var gtotal=0; var guram=0; for(a=0;a<4;a++) { if(document.form.elements[a].checked){ document.form.elements[11+(a*3)].value=item[a]; guram=eval(document.form.elements[12+(a*3)].value=g[a]); price=eval(document.form.elements[13+(a*3)].value=p[a]); }else{ document.form.elements[11+(a*3)].value=""; guram=eval(document.form.elements[12+(a*3)].value=0); price=eval(document.form.elements[13+(a*3)].value=0); } gtotal=gtotal+guram[a]; } document.form.elements[23].value=gtotal; }

  • 自動計算をIEとFireFoxで動かすには？

    いつもお世話になっています。 フォームに入力した値を10で割った数を答えを自動で計算して、別フォームに出力する部分で、FireFoxでは自動計算されるのですがIEでは計算が行われませんでしたｘ＿ｘ； 【ソース】******************************* <script type="text/javascript"> <!-- function keisan(){ // 設定開始 // 商品1 var price1 = document.form1.goods1.value / 10; // 単価を設定 document.form1.field1.value = price1; // 小計を表示 // 合計を計算 var total = price1; // 設定終了 document.form1.field_total.value = total; // 合計を表示 } *********************************** 解決方法をご教授頂けたら幸いです。 何卒よろしくお願い致します。

  • cgiへのパラメータについて

    htmlのformで入力した名前をcgiで受け取ると"encstr"となります。 エンコードした文字列を受け取るにはどのようにすれば良いか教えてください。 <form name="js"> お名前：<input type="text" name="txtb" value=""><br> <input type="button" value="送信" onclick="gogo()"><br> </form> <script type="text/javascript" language="javascript"> <!-- function gogo() { var str1=document.js.txtb.value; var encstr = encodeURI(str1); document.write('<img src="/cgi-bin/gogo.cgi?namae=encstr">'); } // --> </script>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する