• ベストアンサー

関数の中に記述した関数が、ブラウザによって動かない

現在、 [1]読み込まれたページのソースを取得 [2]予め指定したキーワードに合致した言葉があるかどうか判断 [3]結果が正なら、関数実行 というプログラミングをJavaScriptでしております。 ほとんど完成しているのですが、ブラウザによって、正常に表示されたり、されなかったりします。 IE6は正常に表示されますが、FireFox2はロード状態のままなにも起こりません。 なにか、考えられる原因はありますでしょうか? サンプルソースを以下に載せますので、小さなことでも、なにか助言がございましたら、いただけると幸いです。 ※サンプルソースではalert関数を使用しておりますが、実際には外部JavaScriptに記述された関数を実行してます。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>テスト</title> </head> <body> Wolly<br> Welly<br> Willy<br> Wally<br> Wully<br> <script type="text/javascript" charset="utf-8"><!-- ////////// XMLHttpRequest オブジェクトの作成 ////////// httpRequest = false; if(window.XMLHttpRequest) { // Firefox, Opera など httpRequest = new XMLHttpRequest(); httpRequest.overrideMimeType("text/xml"); } else if(window.ActiveXObject) { // IE try { httpRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { httpRequest = new ActiveXObject("Microsoft.XMLHTTP"); } } ////////// GET リクエストの発行 ////////// var serch_url = document.URL; httpRequest.abort(); httpRequest.open("GET", serch_url , true); ////////// レスポンスの処理 ////////// httpRequest.onreadystatechange = function() { if(httpRequest.readyState == 4) { if(httpRequest.status == 200) { var search_txt = "Wally"; var search_txtlen = search_txt.length; var search_01 = httpRequest.responseText.indexOf(search_txt,0); var search_02 = httpRequest.responseText.indexOf(search_txt,search_01+search_txtlen); if((search_01 != -1)&&(search_02 == -1)){ alert("見つからない!"); }else{ alert("見つけた!"); } } } } httpRequest.send(null); // --></script> </body> </html>

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

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

再現しました。 ところで、実行結果はdocument.write("ほげ");なら「ほげ」だけが表示される状況でいいのかな?(俺はあまり詳しくないのだが) で、 http://www.htmq.com/js/document_write.shtml 等を見て、doucment.open();とdocument.close();を入れたらとりあえず 止まった。(ただし、書いてある対応状況がブラウザベースで、規格ベースではないので、このやり方が正しいか判らないので 必ず確認すること!(サンプルにはDOCTYPE宣言などは一切記述していない <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>テスト</title> </head> <body> Wolly<br> Welly<br> Willy<br> Wally<br> Wully<br> <script type="text/javascript" charset="utf-8"><!-- ////////// XMLHttpRequest オブジェクトの作成 ////////// httpRequest = false; if(window.XMLHttpRequest) { // Firefox, Opera など httpRequest = new XMLHttpRequest(); httpRequest.overrideMimeType("text/xml"); } else if(window.ActiveXObject) { // IE try { httpRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { httpRequest = new ActiveXObject("Microsoft.XMLHTTP"); } } ////////// GET リクエストの発行 ////////// var serch_url = document.URL; httpRequest.abort(); httpRequest.open("GET", serch_url , true); ////////// レスポンスの処理 ////////// httpRequest.onreadystatechange = function() { if(httpRequest.readyState == 4) { if(httpRequest.status == 200) { var search_txt = "Wally"; var search_txtlen = search_txt.length; var search_01 = httpRequest.responseText.indexOf(search_txt,0); var search_02 = httpRequest.responseText.indexOf(search_txt,search_01+search_txtlen); document.open(); if((search_01 != -1)&&(search_02 == -1)){ document.write("ほげ"); }else{ document.write("ふが"); } document.close(); } } } httpRequest.send(null); // --></script> </body> </html>

kana2007
質問者

お礼

検証ありがとうございます! >ところで、実行結果はdocument.write("ほげ");なら「ほげ」だけが表示される状況でいいのかな? はい、その通りです。 ただ、IE6では無事表示できたのですが、FireFox2では変化が見られませんでした…。 現在、document.writeの代わりにinnerHTMLを使えないか調べているところです。

kana2007
質問者

補足

結局、document.writeは諦めて、innerHTMLとiframeの組み合わせで対応しました。 いろいろアドバイスしていただき、誠にありがとうございました。 これにて、回答を打ち切らせていただく存じます。 下記は今回、完成にこぎつけたサンプルソースです。 それでは失礼致します。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>テスト</title> </head> <body> Wolly<br> Welly<br> Willy<br> Wally<br> Wully<br> <div id="wallydoko"></div> <script type="text/javascript" charset="utf-8"><!-- ////////// XMLHttpRequest オブジェクトの作成 ////////// httpRequest = false; if(window.XMLHttpRequest) { // Firefox, Opera など httpRequest = new XMLHttpRequest(); httpRequest.overrideMimeType("text/xml"); } else if(window.ActiveXObject) { // IE try { httpRequest = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { httpRequest = new ActiveXObject("Microsoft.XMLHTTP"); } } ////////// GET リクエストの発行 ////////// var serch_url = document.URL; httpRequest.abort(); httpRequest.open("GET", serch_url , true); ////////// レスポンスの処理 ////////// httpRequest.onreadystatechange = function() { if(httpRequest.readyState == 4) { if(httpRequest.status == 200) { var search_txt = "Wally"; var search_txtlen = search_txt.length; var search_01 = httpRequest.responseText.indexOf(search_txt,0); var search_02 = httpRequest.responseText.indexOf(search_txt,search_01+search_txtlen); var search_03 = httpRequest.responseText.indexOf(search_txt,search_02+search_txtlen); if((search_01 != -1)&&(search_02 != -1)&&(search_03 == -1)){ document.getElementById('wallydoko').innerHTML = "<iframe src='表示させたいページURL' width='***' height='***' frameborder='0' scrolling='no' align='top'></iframe>"; } } } } httpRequest.send(null); // --></script> </body> </html>

その他の回答 (5)

回答No.5

関数の中身がわからない以上、これ以上議論が進むことは無いと思います。INVALIDとかWORKSFORMEかな? >エラー要因のひとつとして こちらで検証してみたところ、 regsvr32 msxml6.dllおよびregsvr32.dll msxml4.dll でもエラーが出続けたため調べたところ、 (あれー、でもオブジェクトが生成できないみたいなエラーだった気がするけどなー。だからActiveXの生成で失敗していると思ったんだが。) ぜんっぜん違う原因でした。ごめんなさい。 IE 7では「インターネットオプション」の「詳細設定」で 「ネイティブXMLHTTPをサポートを有効にする」にチェックを入れた場合、 window.XMLHttpRequestはtrueになるようで(外れているときは多分false)、それ以降が実施されますが http://internet.watch.impress.co.jp/static/column/ie7/ ・XMLHttpRequest (中略) >【例えば、IE7にはoverrideMimeTypeメソッドはない】 のでサポートされていないプロパティ云々という表示が出ました。

kana2007
質問者

お礼

詳しく検証していただき、ありがとうございました! 私もいろいろ調べてみたのですが、レスポンスの処理の中の関数で、document.writeを使用しているのが原因のようです。 このページのサンプルソースのalert関数をdocument.writeに変更していただけると再現できます。 Firefoxのバグでしょうか…?

回答No.4

再追記: #2の時はMinefieldでしか検証していません。 #ただ普通の人にMinefieldって言っても通じないことが多いので最近はFirefoxもつけるようにしているんです

回答No.3

IE 7 on Win XP Pro SP2です。 俺のせいですが、以前MSXML 4あたりをregsvr32 -uあたりで削除しようとした覚えがあります(笑)。 #個人的に、上位バージョンが同居しているのってあんまり好きじゃなくて .NET 3.0だけインストールしている状態で、「1.1や2.0をインストーラが求めるようなアプリケーション」なんかあると「ムキー」ってなります(笑) #なので、プロファイル分ければ同居できることがわかっていても、MinefieldとFirefoxは意地でも同時に入れません! #というわけでもう一回regsvr32 msxml4.dllとかはくだらない理由であまりやりたくないのですよ

kana2007
質問者

お礼

ご回答ありがとうございます。 エラー要因のひとつとして、とても勉強になりました!

回答No.2

IEで俺の環境ではMSXMLが登録されてないのかエラーが出た。 Minefield/Firefoxでは、Webサーバ上にあるときは正常動作した反面、 ローカルのファイルに対しては動作しなかった。

kana2007
質問者

お礼

ご回答ありがとうございます。 himajin100000さんが、ご使用のIEのバージョンはいくつでしょうか?

回答No.1

このサンプルで動くみたいですけど? > ※サンプルソースではalert関数を使用しておりますが、実際には外部JavaScriptに記述された関数を実行してます。 この抜粋の外側の部分に問題があるんじゃないでしょうか。

kana2007
質問者

補足

ご回答ありがとうございます。 私もtalooさんのおっしゃる通りだと思います。 サンプルソースと同様に、alert関数の位置で、問題の関数を使用すると、FireFoxのみ、ページがロード状態で固まってしまいます。 しかし、関数の入れ子をしないで、httpRequest.onreadystatechange = function() の外側に記述すると、正常に表示されます。 今回のケースでは、httpRequest.onreadystatechange = function() 内の結果を反映して、関数を実行するかどうか判断しているので、関数の入れ子は避けられないと思っているのですが、何か良いアイディアはありますでしょうか? 問題の関数ですが、諸事情があり公開できません。 大変申し訳ございません…。

関連するQ&A

  • javascriptで困っています。教えてください

    以下のようにjavascriptの内容を書いた外部のテキストファイルを読み込んで、実行しようとしているのですが、うまくいきません。普通にjavascriptを読み込むのは分かっているのですが、このような方法ができないのでしょうか?よろしくお願いします。 <!doctype html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>無題ドキュメント</title> </head> <body> <div id="jsbox"></div> <script type="text/javascript"> var jsbox = document.getElementById("jsbox"); //非同期通信///////////////////////////////////////////// var xmlHttp; loadText(); function loadText(){ if (window.XMLHttpRequest){ xmlHttp = new XMLHttpRequest(); }else{ if (window.ActiveXObject){ xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }else{ xmlHttp = null; } } xmlHttp.onreadystatechange = checkStatus; xmlHttp.open("GET", "http://xxxxxxxxxxxx/js_test.txt", true); xmlHttp.send(null); } function checkStatus(){ if (xmlHttp.readyState == 4 && xmlHttp.status == 200){ var str = xmlHttp.responseText;alert(str); jsbox.innerHTML = str; test_js(); } } ///////////////////////////////////////////////////////////////// </script> </body> </html> テキストファイルをhttp://xxxxxxxxxxxx/js_test.txtに置き、テキストファイルの内容が <script type="text/javascript"> function test_js(){ alert("test"); } </script>

  • Ajaxでデータベース(PostgreSQL)

    を非同期で読み込むことができるでしょうか? ファイルならば下記のようにすれば良いみたいですが データベースの場合のやり方がわかりません。 PostgreSQLのデータを読み込むにはどうしたら良いのでしょうか? <script> var xmlHttp; function loadText() { if (window.XMLHttpRequest) { xmlHttp=new XMLHttpRequest(); } else { if(window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else { xmlHttp = null; } } xmlHttp.onreadystatechange=checkStatus; xmlHttp.open("GET","plan.txt",true); xmlHttp.send(null); } function checkStatus() { if(xmlHttp.readyState==4 && xmlHttp.status==200) { alert(xmlHttp.responseText); } } </script> <form> <input type="button" value="read file" onClick="loadText()"> </form>

  • Ajax テキストエリアについて

    作ったテキストエリアにXmlHttpObjを出力したいのですがどのようにすればいいでしょうか? テキストエリアは <textarea id="text" style="width:100%; height:300px;"disabled></textarea><br> というように作りました。 XmlHttpObjは var xmlhttp; function httpHandler(){ if(xmlhttp.readyState == 4 && xmlhttp.status == 200){ alert(xmlhttp.responseText); } } function onButtonclick(){ xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp.onreadystatechange = httpHandler; xmlhttp.open("GET", "data.txt"); xmlhttp.send(null); } このようにしました。(仮で出力をアラート形式にしております。) 回答よろしくお願いします。

    • ベストアンサー
    • AJAX
  • JavaScriptのDebugが出来るソフト

    お世話になります。 現在、JavaScriptとAjaxのプログラムを組みましたが、非常に細かいところの差異で上手く動いたり、動かなかったりします。 つきましては、JavaScript、Ajax、PHPでのプログラム作成においてDebugができるソフトがあればご紹介下さい。 【一例】 下記コードのcheckとcheck()の違いで上手くいきませんでした。 <html> <head> <meta http-equiv=content-type" content="text/html;charset=utf-8"> <title>Web_data_source</title> <script type="text/javascript"><!-- function getFile() { filename = prompt("test_web.txt","http://localhost/test_web.txt"); //filename = prompt("test_web.txt","http://www.yahoo.co.jp/"); if (!filename) return; xmlhttp = createXMLHttp(); // xmlhttp = xhtttp alert("OK1"); alert(xhttp); if (xhttp !=null) { //alert("ok2-4") xhttp.onreadystatechange = check;←ここの()有る無しで動きませんでした。 xhttp.open("GET",filename,true); //alert("OK2") xhttp.send(null); } //} function check() { if (xhttp.readyState == 4 && xhttp.status == 200) { document.aForm.tArea.value = xhttp.responseText; //document=xhttp.responseText; alert("OK"); }else{ alert("NG"); alert(xhttp.readyState); alert(xhttp.status); } } // XMLHttpオブジェクト作成 function createXMLHttp() { try { //return new ActiveXObject("Msxml2t.XMLHTTP"); //IE用 //alert("OK4"); xhttp= new XMLHttpRequest(); //Firefox用 alert("OK3"); }catch(e){ try { xhttp = new ActiveXObject("Msxml2t.XMLHTTP"); alert("OK3-1"); }catch(e2){ try { xhttp= new ActiveXObject("Microsoft.XMLHTTP") // return null; alert("OK3-2"); }catch(e3){ xhttp= null; } } } } } --></script> </head> <body> <form name="aForm"> <input type="button" value="get file" onClick="getFile()"><br> <textarea cols="40" rows="20" id="tArea"></textarea> </body> <html> 宜しくご回答頂けます様お願いします。

  • Ajaxで表示させると内容が不変

    下記Ajaxでtest.txtを表示できたのですが test.txtの内容を Hello Japan. 変えてもブラウザのキャッシュをクリアしない限り Hello World! が出つづけます。 下記ページにキャッシュ無効のヘッダをつけても同じです。 子の問題を解決する手段を教えてください。 test.txt: Hello World! x.html: <script> var xmlHttp; function loadText() {  if (window.XMLHttpRequest)  {   xmlHttp = new XMLHttpRequest();  }  else  {   if (window.ActiveXObject)   {    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");   }   else   {    xmlHttp = null;   }  }  xmlHttp.onreadystatechange = checkStatus;  xmlHttp.open("GET","test.txt",true); xmlHttp.send(null); } function checkStatus() { if (xmlHttp.readyState==4&&xmlHttp.status==200) { var node = document.getElementById("disp"); node.innerHTML = xmlHttp.responseText; } } </script> <form> <input type="button" value="push" onClick="loadText()"> </form> <div id="disp"></div>

  • XMLHttpRequestのブラウザ対応

    JavaScriptで、あるURLの結果を取得しようと以下のようなスクリプトを組みました。 var xmlHttp = false; function loadText(){ xmlHttp = new XMLHttpRequest(); xmlHttp.open("GET", "http://hogehoge, true); xmlHttp.onreadystatechange = checkStatus; xmlHttp.send(null); } function checkStatus(){ if (xmlHttp.readyState == 4 && xmlHttp.status == 200){ res = xmlHttp.responseText; alert(res); } } IE8では、結果が取得できたのですが、firefox4.0.1,Chromeでは取得できませんでした。 xmlHttp.status が0となってしまいました。 ただし、GET対象のURLをローカルサーバにすると、取得することができました。 firefox4.0.1,Chromeのブラウザの設定なのでしょうか?それともスクリプトの書き方に問題があるのでしょうか? すみませんが、教えてください。

  • responseTextでエラーが出ます

    下記プログラムがIEアクセスでエラーが出ます。 サーバ環境はdebianでapache2を使用しています。 エラーの内容はIEのステータスバーにエラーマークが 出るだけですが、同じdebian環境の別サーバではちゃんと 動作します。 また、winXPにインストールしたapache2でもちゃんと動きます。 同じdebian環境という事でapacheのコンフィグファイルなども調べてみましたが、全くだめでした。 何か考えられる事があるようでしたらどなたかお教えいただけないでしょうか? ちなみにapacheのエラーログは吐かれていませんでした。 う~~~ん。謎です。 ********[ index.html ]********** <HTML> <HEAD> <TITLE>Ajax Sample1</TITLE> <script language="javascript"> <!-- function AjaxSample1() { var xmlhttp = false; try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { xmlhttp = false; } if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp = new XMLHttpRequest(); } if (xmlhttp) { xmlhttp.open('GET', 'read.txt',true); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { var disp = document.getElementById('disp'); disp.innerHTML=xmlhttp.responseText; } } xmlhttp.send(null); } } --> </script> </HEAD> <BODY> <a href="javascript:void(0);" onclick="AjaxSample1();">XMLHTTP読み込み</a> <div id="disp"></div> </BODY> </HTML> **********[ read.txt ]**************** <font color="red">Sample1</font><br /> <font color="blue">Sample2</font><br /> ***************************************

  • jQueryのloadのcallbackが変な動作

    jQueryのloadメソッドでCallBackが成功しているにも関わらず失敗する場合があります・・・対象方法が全くわからないのでご教示願えませんでしょうか? 【A.html】 <script type="text/javascript" src="jquery-1.4.1.min.js"></script> <table> <tr> <td><div id = "target_1"><div id = "target_2"></td> </tr> </table> <script type="text/javascript"> $.ajaxSetup({ cache: false }); var xmlHttp; xmlHttp = new XMLHttpRequest(); xmlHttp.open("GET", "A.html", false); xmlHttp.send(null); alert(xmlHttp.responseText); $(document).ready(function(){ $("#target_1").load("a.txt .tag", function(Text, status) { if ($("#target_1").text() == "あああ") { $("#target_1").replaceWith("<img src = 'a.png'>"); else if ($("#target_1").text() == "いいい") $("#target_1").replaceWith("<img src = 'b.png'>"); alert( "text: " + Text + "\nstatus: " + status ); }); $(document).ready(function(){ $("#target_1").load("a.txt .tag", function(Text, status) { if ($("#target_1").text() == "あああ") { $("#target_2").load("a.txt .5tag");★ else if ($("#target_1").text() == "いいい") $("#target_2").load("a.txt .5tag");★ alert( "text: " + Text + "\nstatus: " + status ); }); }); 問題は★印が付いているところの処理です。 アラートではSUCCESSになるのですが、なぜかロードが失敗する時があります。 割合としては10回に1回程度で1回発生するとブラウザの再起動をしない限り二度とロードができなくなります。 原因は何がいけないのでしょうか?

  • サーバの、クライアント間でデータ共有

    JavaScript, HTML5 で作成しています。 現在、サーバ側の hoge.txt を読込んで、読んだ内容をクライアント側へ 渡す事を行おうとしています。 ActiveXObject を使用してファイルを読み、取得した responseText を <INPUT type="hidden">へ書き込んでサーバからクライアントへサーバの hoge.txt の内容をクライアントへ渡す事を実現をさせています。 上記では、改行なしの数十文字程度さであれば問題ないjのですが、hoge.txt は改行ありの文字数制限なし との仕様との事なので、上記では仕様の要件を満たせていません。 サーバからクライアントへ hoge.txt をダウンロードして読み込ませた方が 要求を満たす事ができるのでしょうか? 何か良い方法があったらお教えください。 ● 現在のソース 【HTML】 <body onload="initialize()"> <input type="hidden" id="hogetext" value="" /> 【JavaScript】 function initialize() { if (navigator.appName.indexOf("Microsoft") > -1) { xmlhttp = new ActiveXObject("MSXML2.XMLHTTP"); } else { xmlhttp = new XMLHttpRequest(); } xmlhttp.open("GET", 'hoge.txt', true); if (navigator.appName.indexOf("Microsoft") > -1) { xmlhttp.onreadystatechange = SetText; } else { xmlhttp.onload = SetText; } xmlhttp.send(""); } function SetText() { if (xmlhttp.readyState == 4) { document.getElementById('hogetext').value = xmlhttp.responseText; } }

    • ベストアンサー
    • HTML
  • JavaScriptでの外部データの取り込みについて

    お世話になります。 JavaScriptにて外部fileデータ(c:test_web.txt)を取り込み、ブラウザーに設定した枠内に表示させたいのですが、上手くいきません。 本ソースは参考書のものをそのまま使っているのですが、枠内の表示がされません。 自分なりに調べたところ、外部データを取得できていない様です。 つきましては、下記ソースにて不具合点をご指摘、ご意見頂けます様お願いします。 【JavaScript】 <html> <head> <meta http-equiv=content-type" content="text/html;charset=utf-8"> <title>Web_data_source</title> <script type="text/javascript"><!-- function getFile() { filename = prompt("test_web.txt","c:test_web.txt"); if (!filename) return; xmlhttp=createXMLHttp(); if (xmlhttp) { xmlhttp.onreadystatechange = check(); xmlhttp.open("GET", filename,true); xmlhttp.send(null); } } function check() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { document.aForm.tArea.value = xmlhttp.responseText; } } // XMLHttpオブジェクト作成 function createXMLHttp() { try { return new ActiveXObject("Msxml2t.XMLHTTP"); }catch(e){ try { return new XMLHttpRequest(); }catch(e) { return null; } } return null; } --></script> </head> <body> <form name="aForm"> <input type="button" value="file_get" onClick="getFile()"><br> <textarea cols="40" rows="20" id="tArea"> </textarea><br> </body> <html> 【c:test_web.txt】 test ok 宜しくご回答を頂けます様お願いします。