外部jsへの変換でスクリプトが動作しない場合の対処方法

このQ&Aのポイント
  • head内のスクリプトを外部jsに変換する場合、スクリプトの一部を変更する必要があります。
  • 外部jsに変換する際には、スクリプトの冒頭の`<script type ='text/javascript'>`と末尾の`</script>`は削除します。
  • 変更後のスクリプトを外部ファイルに保存し、`<script>`タグの中身を外部ファイルへのパスに置き換えます。
回答を見る
  • ベストアンサー

head内から外部jsにするとスクリプトが動作しません。

下記の「●htmlのhead内に書かれているスクリプト」を外部jsにしたく、 <script type ="text/javascript"> <!-- の部分と --> </script> 以外の部分をテキストファイルにペーストして外部jsにしたのですが、 上手く動作しません。 この場合、どうやったら外部jsとして動作させることができますでしょうか? どうかご教授下さいますよう、よろしくお願い致します。 フォームタグは以下のようになっています。 <form method="POST" action="●●.cgi" name="f" onSubmit="return check()"> ●htmlのhead内に書かれているスクリプト <script type ="text/javascript"> <!-- function check(){ var errormsg=""; var mailerror=0; if(document.f.name1.value==""){ errormsg+="※お名前が入力されていません\n"; } if(document.f.kana1.value==""){ errormsg+="※フリガナが入力されていません\n"; } if(document.f.postal.value==""){ errormsg+="※郵便番号が入力されていません。\n"; } if(document.f.pref.value==""){ errormsg+="※都道府県が選択されていません。\n"; } if(document.f.adress.value==""){ errormsg+="※住所が入力されていません。\n"; } if(document.f.email.value==""){ errormsg+="※メールアドレスが入力されていません。\n"; mailerror=1; } if(document.f.email2.value==""){ errormsg+="※確認用メールアドレスが入力されていません。\n"; mailerror=1; } if(!mailerror){ if(document.f.email.value != document.f.email2.value){ errormsg+="※メールアドレスに間違いがあります。\n"; } } var mail=document.f.email.value; var c; var zen=false; for(i=0;i<mail.length;i++){ c=mail.charCodeAt(i); if(c >= 65345 && c<=65370){ errormsg+="※メールアドレスに全角文字が含まれています。\nメールアドレスは半角英数字を入力してください。\n"; zen=true; break; } } if(!zen){ var at=mail.indexOf("@"); var dot=mail.lastIndexOf("."); var space=mail.indexOf(" "); var ok=false; if(at != -1 && at != 0 && dot != -1 && dot > at +1 && dot < mail.length -1 && space == -1){ ok=true; } if(!ok){ errormsg+="※メールアドレスが正しくありません。\n"; } } if(document.f.tel.value==""){ errormsg+="※お電話番号が入力されていません。\n"; } if(document.f.haisou.checked==true){ if(document.f.name_rcpt1.value==""){ errormsg+="※お届け先のお名前が入力されていません\n"; } if(document.f.kana_rcpt1.value==""){ errormsg+="※お届け先のフリガナが入力されていません\n"; } if(document.f.postal_rcpt.value==""){ errormsg+="※お届け先の郵便番号が入力されていません。\n"; } if(document.f.pref.selectedIndex == 0){ errormsg+="※お届け先の都道府県が選択されていません。\n"; } if(document.f.adress_rcpt.value==""){ errormsg+="※お届け先の住所が入力されていません。\n"; } if(document.f.tel_rcpt.value==""){ errormsg+="※お届け先の電話番号が入力されていません。\n"; } } var pay_flag=0; var deliver_flag=0; var pay=""; var deliver=""; for(i=0;i<document.f.elements.length;i++){ if(document.f.elements[i].name == "pay"){ pay_flag++; } else if(document.f.elements[i].name == "deliver"){ deliver_flag++; } } if(pay_flag){ if(pay_flag > 1){ for(i=0;i<document.f.pay.length;i++){ if(document.f.pay[i].checked == true){ pay=document.f.pay[i].value; break; } } } else{ if(document.f.pay.checked==true){ pay=document.f.pay.value; } } } if(deliver_flag){ if(deliver_flag > 1){ for(i=0;i<document.f.deliver.length;i++){ if(document.f.deliver[i].checked == true){ deliver=document.f.deliver[i].value; break; } } } else{ if(document.f.deliver.checked==true){ deliver=document.f.pay.value; } } } if(errormsg){ alert(errormsg); return false; } } --> </script>

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

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

HTMLソースと、jsソースの文字コードは同じものを利用していますか?

nafufuna
質問者

お礼

早速ご回答頂き誠にありがとうございます。 yambejp様のおっしゃる通り、外部jsの文字コードの設定ミスで、文字コード を統一させてもう一度確認しましたら、問題なく動作致しました。 本当にありがとうございました。

関連するQ&A

  • フォームのチェックについて

    今、フォームの送信ボタンを押すとチェックする 関数を作成しております。 function restChar() { if(10000 < document.F1.ご質問内容.value.length) window.alert("ご質問内容は全角5,000字以内でお願いします"); } function check(){ var flag = 0; if(document.F1.name.value == ""){ // 「お名前」の入力をチェック flag = 1; } else if(document.F1.kana.value == ""){ // 「パスワード」の入力をチェック flag = 2; } else if(document.F1.mail.value == ""){ // 「コメント」の入力をチェック flag = 3; }      else if(document.F1.ご質問内容.value == ""){ // 「コメント」の入力をチェック flag = 4; } if(flag == 1){ window.alert('お名前を入力してください'); // 入力漏れがあれば警告ダイアログを表示 return false; // 送信を中止 } if(flag == 2){ window.alert('フリガナを入力してください'); // 入力漏れがあれば警告ダイアログを表示 return false; // 送信を中止 } if(flag == 3){ window.alert('メールアドレスを入力してください'); // 入力漏れがあれば警告ダイアログを表示 return false; // 送信を中止 }      if(flag == 4){ window.alert('ご質問内容を入力して下さい'); // 入力漏れがあれば警告ダイアログを表示 return false; // 送信を中止 } fOBJ = document.F1.mail.value; check = /.+@.+\..+/; if (!fOBJ.match(check)){ window.alert("メールアドレスが正しくありません"); return false; // 送信を中止 } fOBJ = document.F1.ご質問内容.value.length; if(10000 < fOBJ){ window.alert("ご質問内容は全角5,000字以内でお願いします"); return false; // 送信を中止 } return true; // 送信を実行 } こんな感じです。 1-4のチェックは問題ないのですが、 アドレスと文字数のチェックは、一度は ダイアログがでますが、連続で押すと通ってしまいます。 何がわるいのでしょうか?

    • ベストアンサー
    • Java
  • チェックボックスの選択チェック

    ラジオボタンの選択チェック、セレクトボタンの選択チェックのあとにチェックボックスの選択チェックをしたいのですが、どのように入れればよいのでしょうか。教えてください。 ↓参考までに↓ function check() { var flag=0; if( document.form1.seibetu.length){ flag=1; var i; for(i=0; i<document.form1.seibetu.length; i++) if(document.form1.seibetu[i].checked)flag=false; } if(flag){ alert('性別が選択されていません'); return false; } if(document.form1.nenrei.value=="")flag=true; if(flag){ alert('年齢が選択されていません'); return false; } if( document.form1.Q1.length){ flag=1; var i; for(var i=0; i<document.form1.Q1.length; i++) if(document.form1.Q1[i].checked)flag=false; if(flag){ alert('Q1が選択されていません'); return false; } else {★★★ここに入れたい★★★   ;} } }

  • Javascriptの入力チェック、日本語について

    Javascriptの入力チェックをホームページ内に使いたいのですが、 ●住所(都道府県) ●中学校・高校 のようにnameに「()」や「・」がある文字を設定するとエラーになってしまい入力チェックできません。 ■エラーになる例 if(document.f.住所(都道府県).value=="") { errormsg+="住所(都道府県)を入力してください。\n"; } if(document.f.中学校・高校.value=="") { errormsg+="中学校・高校を入力してください。\n"; } HTMLは以下のようにしています。 <input type="text" name="住所(都道府県)"> <input type="text" name="中学校・高校"> nameに日本語を使う場合、どのようにしたら入力チェックができるのでしょうか。 どうぞよろしくお願い致します。

  • javascriptの動作で困ってます。

    動作不良が三箇所あります。 プログラムに詳しい方がいらっしゃいましたら原因を教えて下さい。 ・未入力の質問をアラートで一括表示させたいのですが、 (3)のテキストエリアの箇所が未入力なのにアラートに表示できません。 判定のtrueとfalseを逆にして試すと、(3)のアラートは表示されるものの、記入しても アラートが出続けます。 ・1度しか指定していないにも関わらず同じ内容の警告アラートが2回出てしまう原因が分かりません。 ・入力した項目や選択した項目に関しては未入力項目のアラートとは別のアラートを用意してvalueの値をアラートで一括表示させたいのですが、関数を定義しているにも関わらず、関数が定義されていないとエラーメッセージが帰ってきて、表示されません。 ソースコードは以下になります。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> function check(){ var msg = ""; var msg2 = ""; var str = document.form.id.value; var str2 = document.form.pass.value; if (str.match(/[^0-9]+/)) { alert("客番号は数字のみ"); } if (str.length>5) { alert("客番号は4~5桁"); } if(str.length<4){ alert("客番号は4~5桁"); } if(str==""){ msg += "客番号が未入力です。\n"; }else{ msg2 += document.form.id.value; } if(str2==""){ msg += "パスワードが未入力です。\n"; }else{ msg2 += document.form.pass.value; } if(radioCheck()==false){ msg += "(1)が未入力です。\n"; } if(checkboxCheck()==false){ msg += "(2)が未入力です。\n"; } if(textareaCheck()==false){ msg += "(3)が未入力です。\n"; } if(selectCheck()==false){ msg += "(4)が未入力です。\n"; } if(msg != ""){ //メッセージを出力 alert(msg); } if(radioCheck()==true){ msg2 += document.form.eng.value ; } if(checkboxCheck()==true){ msg2 += document.form.lang.value ; } if(txtareaCheck()==true){ msg2 += document.form.opinion.value ; } if(selectCheck()==true){ msg2 += document.form.age.value ; } if(msg2 != ""){ //メッセージを出力 alert(msg2); } } function radioCheck(){ var count = 0; var eng=document.getElementsByName("eng"); for(var i=0;i<eng.length;i++){ if(eng[i].checked){ count++; } } if(count != 0){ return true; } else{ return false; } } function checkboxCheck(){ var count = 0; var checklist=document.getElementsByName("lang[]"); for(var i= 0;i<checklist.length;i++){ if(checklist[i].checked){ count++; } } if(count != 0){ return true; } else{ return false; } } function textareaCheck(){ var textarea=document.getElementById("demand").value; if(textarea!=""){ return true; } else{ return false; } } function selectCheck(){ var selectValue=document.getElementById("age").value; if(selectValue!="選択されていません"){ return true; } else{ return false; } } </script> </head> <body> <form action="http://www" method="post" name="form"onSubmit="return check()"> <h1>アンケート</h1> <p><label>客番号:<input type="text" name="id"></label></p> <p><label>パスワード:<input type="password" name="pass"></label></p> <h2>(1)</h2> <p>食べたいですか?<br> <br> <input type="radio" name="eng" value="yes"> はい <input type="radio" name="eng" value="neither"> どちらでもない <input type="radio" name="eng" value="no"> いいえ </p> <h2>(2)</h2> <p>食べたい物<br> <br> <input type="checkbox" name="lang[]" value="apple"> りんご <input type="checkbox" name="lang[]" value="banana"> バナナ <input type="checkbox" name="lang[]" value="pasta"> パスタ <input type="checkbox" name="lang[]" value="pizza"> ピザ <input type="checkbox" name="lang[]" value="supu"> スープ </p> <h2>(3)</h2> <p>意見(自由記述)<br> <textarea id="demand" name="opinion" cols="40" rows="4" maxlength="20"> </textarea> </p> <h2>(4)</h2> <p> 年齢を選択 <select id="age" name="age"> <option selected value="選択されていません">以下から選択</option> <option value="10~19才">10~19才</option> <option value="20~29才">20~29才</option> <option value="30~39才">30~39才</option> <option value="40~49才">40~49才</option> <option value="50~59才">50~59才</option> <option value="60~69才">60~69才</option> <option value="70才~">70才~</option> </select> </p> <p> <input type="submit" name="button" value="送信" onclick="check();"> <input type="reset" value="クリア"> </p> </body> </form> </html>

  • JavaScript 初心者です。

    急遽ホームページ作成をやることになり大変困っています。 何もかも初心者で全くわからない状態ですのでよろしくお願い致します。 お客様情報入力で送信ボタンで押すとメールで情報が届く様にしています。 送信ボタンを押したときに、入力チェックをかけているのですが、複数のテキストボックス(郵便番号を入力するテキストボックス)のチェック方法が分かりません。 郵便番号は、3桁-4桁で入力して頂く様にしています。 HTML(郵便番号のみです)・・・ <INPUT maxlength="3" size="3" type="text" name="iyubin" value="" style="ime-mode:disabled;" id="01">-<INPUT type="hidden" name="iyubin" value="-"><INPUT maxlength="4" size="4" type="text" name="zyubin" value="" style="ime-mode:disabled;" id="02"> JavaScriptでの入力チェック(省略をしていますが、正常に動作しているヵ所です)・・・ //お客様情報 function check(){ var flag = 0; // お名前 if ((flag==0) && (document.form.gName1.value == "")){ flag = 1; } if(flag){ window.alert('【お名前】を入力して下さい。'); // 入力されていない場合は警告ダイアログを表示 return false; // 送信を中止 } // ふりがな if ((flag==0) && (document.form.hName2.value == "")){ flag = 1; } if(flag){ window.alert('【ふりかな】を入力して下さい。'); // 入力されていない場合は警告ダイアログを表示 return false; // 送信を中止 } // 性別 if((flag==0) && (document.form.iSeibetsu.length)) { // 選択肢が複数ある場合 flag = 1; var i; for(i = 0; i < document.form.iSeibetsu.length; i ++){ if(document.form.iSeibetsu[i].checked){ flag = 0; break; } } } else{ // 選択肢が1つだけの場合 if((flag==0) && (!document.form.iSeibetsu.checked)){ flag = 1; } } if(flag){ window.alert('【性別】を選択して下さい。'); // 選択されていない場合は警告ダイアログを表示 return false; // 送信を中止 } //このヵ所に郵便番号の入力チェックを入れたいです。 すみませんが、よろしくお願い致します。

  • プロパティ名に変数を連結する

    javascriptによるWebサイト内のフォーム内容入力チェックを行っています。 <input type="text" name="text1"> <input type="text" name="text2"> <input type="text" name="text3"> . . というように連番で付けられたフォーム部品があった場合 if(document.myForm.text1.value==""){flag=1;} if(document.myForm.text2.value==""){flag=1;} if(document.myForm.text3.value==""){flag=1;} のようにしてやれば空欄チェックが行えますが これがいくつもある場合、textの後に続く番号をfor等で 繰り返し処理によって行う場合、どのように記述するでしょうか。 試しに for(i = 0 ; i <= 100 ;i++){ var text; hoge = "document.myForm.text" + i + ".value"; if(hoge == ""){flag=1;} } のようにしましたが、この方法だとhoge自体が文字列として みなされてしまいプロパティの指定ができなくなっている(?)のでしょうか。 ご助言いただけると助かります。

  • ラジオボタンとセレクトボックスの選択チェック

    ラジオボタン、セレクトボタンの選択チェックをしたいのですが 同時にチェックする場合どうすればよいのでしょうか。 失敗策ですが、参考までに↓ function check() { var flag=0; if( document.form1.seibetu.length){ flag=1; var i; for(i=0; i<document.form1.seibetu.length; i++){ if(document.form1.seibetu[i].checked){ flag=0; break; } } } else{ if(!document.form1.seibetu.checked){ flag=1; } } if(flag){ window.alert('性別が選択されていません'); return false; } else{ return true; } if(document.form1.nenrei.options[document.form1.nenrei.selectedIndex]. value==""){ flag=1; } if(flag){ window.alert('年齢が選択されていません'); return false; } else{return true; } }

  • for in と 接続演算子について

    <!-- function check(){ var flag = 0; if(document.registform.user.value==""){ flag = 1; var error1 = document.getElementById("error1"); if(error1 == null){ var element1=document.createElement("div"); element1.innerHTML='<span class="error0" id="error1">ユーザー名を入力してください。</span>'; var ojbody1=document.getElementById("td_error1"); ojbody1.appendChild(element1); } } if(document.registform.pass.value==""){ flag = 1; var error2 = document.getElementById("error2"); if(error2 == null){ var element2=document.createElement("div"); element2.innerHTML='<span class="error0" id="error2">パスワードを入力してください。</span>'; var ojbody2=document.getElementById("td_error2"); ojbody2.appendChild(element2); } } if(document.registform.pass2.value==""){ flag = 1; var error3 = document.getElementById("error3"); if(error3 == null){ var element3=document.createElement("div"); element3.innerHTML='<span class="error0" id="error3">パスワード(確認)を入力してください。</span>'; var ojbody3=document.getElementById("td_error3"); ojbody3.appendChild(element3); } } if(flag == 0){ return true; }else{ return false; } } //--> javascript初心者です。 この処理をfor(key in array)を使って簡単にできるかも... と思ったんですが接続演算子の使い方がよくわかりません。 プログラム自体初心者独学で手探りでやっているため考え方が間違っている場合などありましたらアドバイス等もいただけたらうれしいです。 if(document.registform.user(☆).value==""){ flag = 1; var error1(☆) = document.getElementById("error1(☆)"); if(error1(☆) == null){ var element1(☆)=document.createElement("div"); element1(☆).innerHTML='<span class="error0" id="error1(☆)">ユーザー名(☆)を入力してください。</span>'; var ojbody1(☆)=document.getElementById("td_error1(☆)"); ojbody1.appendChild(element1(☆)); }} (☆)のところが接続演算子が使えればと思いました。 例えばvar element + key でelement1の変数というのは無理なのでしょうか? もし可能ならgetElementById("error + key ")はどういった書き方をすればよいでしょうか? よろしくお願いします。

  • Java Scriptで・・・

    <form name="f"> <table border> <tr><td>番号</td><td>問題</td><td>解答</td><td>正誤</td></tr> <script type="text/javascript"> <!-- // 変数・関数の定義 var i, n1, n2; var s = new Array(11); // 正解を保存する配列 s[0] ~ s[10] function myrandom(n) { return Math.floor(Math.random() * n); } function check() { var i, ok=0, ng=0; for (i=1; i<=10; i++) { if (document.f.elements["s" + i].value == s[i]) { document.f.elements["c" + i].value = "○"; ok++; } else { document.f.elements["c" + i].value = "×"; ng++; } } document.f.ok.value = ok; document.f.ng.value = ng; } for(i=1; i<=10; i++){ n1 = myrandom(10) + 1; n2 = myrandom(10) + 1; s[i] = n1 + n2; document.writeln('<tr>'); document.writeln('<td>' + i + '</td>'); document.writeln('<td>' + n1 + ' + ' + n2 + ' =</td>'); document.writeln('<td><input type="text" name="s' + i + '" size="3"></td>'); document.writeln('<td><input type="text" name="c' + i + '" size="3"></td>'); document.writeln('</tr>'); } // --> </script> </table> <input type="button" value="答え合わせ" onclick="check();"> 正答数:<input type="text" name="ok" size="3"> 誤答数:<input type="text" name="ng" size="3"> </form> このようなプログラムを作ったのですが、この表示される10問が全部異なる問題となるようにするにはどうすればいいでしょうか?

  • 入力チェックをしたいです。

    結構初心者です。 フォームに入力された内容をチェックしたいので、まず下記のように書きました。 <script Language="JavaScript"> <!-- function submitCheck(){ var flag = 0; // 設定開始(必須にする項目を設定します) if(document.insert.MatterID.value == ""){ flag = 1; } else if(document.insert.name.value == ""){ flag = 1; } else if(document.insert.Correspondencedate.value == ""){ flag = 1; } if(flag){ window.alert('必須項目に未入力があります。'); // チェックされていない場合は警告ダイアログを表示 return false; // 送信を中止 } else{ return true; // 送信を実行 } } --> </script> で、これにチェックボックスの入力チェックも含めたいのですが、ただ else if(document.insert.bld_ReceiptNo.checked){ flag = 1; } こうするだけではダメなのですね;; どうすればいいかお知恵を拝借できませんでしょうか。

専門家に質問してみよう