- 締切済み
[JS] IEでjavascriptを呼び出せない
ページの読み込み時にリンク先をjavascriptの関数に変更しています。 IEではlocalhostなら変更後の関数を呼び出せるのですが、 IPでアクセスすると変更後の関数を呼び出せていないようです。 FF/Chrome/Operaではいずれの場合もうまくいきます。 具体的には、IEで以下のhtmlを http://localhost/ で読み込むと"change"をクリックで"changed!"に変更される http://192.168.0.1/ で読み込むと"change"をクリックしても何も変わらない。 何が問題なのでしょうか。 +++問題のindex.html++++++++++++++++++ <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <body> <a href="#" id="change">change</a> <div id="test">TEST</div> <div> <script type="text/javascript" src="./prototype.js"></script> <script type="text/javascript"> t = new test(); function test(){ var self = this; self.change = function(arg){ document.getElementById("test").innerHTML = "changed!"; return false; } } document.getElementById("change").setAttribute("onclick", "return t.change();"); </script> </div> </body> </html> +++++++++++++++++++++++++++
- palayo
- お礼率42% (84/198)
- JavaScript
- 回答数2
- ありがとう数0
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- nicorus
- ベストアンサー率70% (12/17)
IEにはいくつかのセキュリティのルールが存在していて それをホスト名などによって切り分けています。 「http://192.168.0.1/」おそらくイントラネットのセキュリティを使用しているのではないでしょうか？ IEのセキュリティでJavascriptが無効になっていないか？ ドメイン利用時はポリシーで制限がかかっていないか？ などを調べてみましょう。
- lilillllililili
- ベストアンサー率71% (23/32)
単純にIEのバグかもしれません。 prototype.jsのパスは間違っていませんか？もう一度ご確認ください。
関連するQ&A
- [javascript][DOM]getElementByIdやremoveChildの戻り値と処理の結果
以前から気になっていたけれど聞かなかったこと。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <title>QFUMEI テストケース1</title> <script type="application/ecmascript"> function init(){ var hoge = document.getElementById("hoge"); var fuga = document.getElementById("fuga"); hoge.removeChild(fuga); alert(fuga); // [object HTMLParagraphElement] ← nullではない fuga = document.getElementById("fuga"); alert(fuga); // null } </script> </head> <body onload="init();"> <div id="hoge"> <p id="fuga">ほげ</p> </div> </body> </html> 結局 fuga = getElementById("fuga")によって 何が代入されているのでしょう？ document上のp#fugaへの参照であれば removeChildの直後 fuga = nullとなっていてもよさそうだなと思っているのですが・・・・。 hoge.firstChild.nodeValueをいじるとp要素内の文字列が変化するし・・・・
- ベストアンサー
- JavaScript
- JavaScriptを使ってWebページにメッセージを表示させる
html内に<div id="info"></div>と書き、それをjavascriptのプログラムから「こんにちは」というメッセージを表示させるようにしたいのですが、何度試しても製作途中の段階でdocument.getElementById(id) has no propertiesというエラーが出てしまいます。（←Firebugでエラーが検出されます） どこが間違っているのか教えていただけると助かります。 ================= HTML ================= <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja" dir="ltr"> <head> <meta http-equiv="content-script-type" content="text/javascript" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>map</title> <link rel="stylesheet" type="text/css" href="common/css/main.css" /> <script src="common/js/main.js" type="text/javascript" charset="utf-8"></script> </head> <body> <div id="info"></div> </body> </html> ================= JavaScript ================= var map window.onload = function() { load(); } function _d(id, htmlTxt) { document.getElementById(id).innerHTML = htmlTxt; } _d("info","こんにちは");
- 締切済み
- JavaScript
- JavaScriptによるCSS変更がIE以外のFirefox,Operaなどで動作しない
id="tab"要素の背景画像positionをJavaScriptで動的に変更したいのですが、以下のソースではFirefox、Operaで動作しません。IEでは動作確認できました。 原因がわからないのでこちらでお聞きすることにしました。 よろしくお願いします。 <!-- HTMLソース --> <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <meta http-equiv="content-script-type" content="text/javascript" /> <link rel="stylesheet"href="test.css"type="text/css" /> <script type="text/javascript" src="test.js"></script> <title>test</title> </head> <body> <div id="javascript_tab_sample"> <ul class="tabstyle"id="tab"> <li><a href="###" onclick="effect1()">title1</a></li> <li><a href="###" onclick="effect2()">title2</a></li> <li><a href="###" onclick="effect3()">title3</a></li> </ul> </div> </body> </html> /*-- CSSソース --*/ ul.tabstyle { list-style:none; } div#javascript_tab_sample ul#tab { background:url('./backimg.png');/*デフォルト背景*/ float:left; width:100%; } div#javascript_tab_sample ul#tab li { height: 41px;/*縦幅*/ padding:0em 0; text-align:center; border-bottom:none; float:left; width:5em; } /*-- JavaScriptソース --*/ function effect1(){ var element1 = document.getElementById('tab'); element1.style.backgroundPositionY='0'; } function effect2(){ var element2 = document.getElementById('tab'); element2.style.backgroundPositionY='82'; } function effect3(){ var element3 = document.getElementById('tab'); element3.style.backgroundPositionY='41'; }
- ベストアンサー
- JavaScript
- firefox+xhtml+javascript
お世話になっております。 divをweb上でドラッグできるスクリプトを組みました。 Opera9.6,IE6では動いているのですが、Firefoxでは、ある条件下でしか動きません。 ある条件とは、DOCTYPEの宣言がされていないことで、XHTMLにしようとDOCTYPEを宣言すると、動作しなくなってしまいます。 <?xml version='1.0' encoding='UTF-8'?> <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'> <html xmlns='http://www.w3.org/1999/xhtml' xml:lang='ja'> <head> <meta http-equiv='Content-Type' content='text/html; charset=UTF-8' /> <meta http-equiv='Content-Script-Type' content='text/javascript' /> <title>test</title> <script type='text/javascript' src='FILENAME.js'></script> -------- <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'> を消せば動きます。 仮に、DOCTYPEをHTML4.1などにしても動きません。 クオートをシングルからダブルにしても同じです。 動かない状態でも、JS自体は読んで、onload関数の中は見に行っているようです（alertを埋め込んだらでたので） 可能性として、 外部ファイルのJSの書き方に問題があるのでしょうか？ それとも、HTML側に問題があるのでしょうか？ ソースを見なくても何か考えられることがあれば、教えてください。 よろしくお願いします。
- ベストアンサー
- JavaScript
- js 引用符
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>サンプル</title> </head> <body> <div id="a"></div> <script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.2/moment.min.js"></script> <script type="text/javascript" src="jquery-1.7.2.min.js"></script> <script type="text/javascript" src="moment.js"></script> <script src="fastclick.js"></script> <script> $(function(){ var retinaSwitch = window.<span class="searchword">devicePixelRatio</span>; if(retinaSwitch == 1) { $('#container').html('Retinaディスプレイではありません'); } else if(retinaSwitch == 2) { $('#container').html('Retinaディスプレイです'); } }); </script> </body> </html> javascriptのコードなのですがWebサイトからコピペした文章が上手く反映されません。引用符関係のイージーミスだとは思うのですが、ちょっとドツボに嵌っているので、ご指摘頂ければと思います。
- ベストアンサー
- JavaScript
- php javascript
今、googlemapsに天気情報を読み込ませて天気によって場所を表示させたいと思っております。そこで天気情報をhttp://web1.aaacafe.ne.jp/~tenki/tenki.xml をMagpieRSSを用いて、 http://kenbo.net/tenki/tenki_rss.html を参考にし取得しました。 また↓のサイトを参考にし http://www.nob.gr.jp/tips/tips.html 天気の部分だけを抜き出すことが出来るようになりました。 tenki_rss.php↓ <?php … … $wether = split("<br />", $description); switch($wether[1]){ case "晴": ☆☆☆☆☆☆☆☆☆ break; case "雨": ☆☆☆☆☆☆☆☆☆ ・・・・・・ } … … ?> 上記の☆部分が実行されたらメインのgooglemapのhtml↓ test.html↓ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> … <script src="http://maps.google.com/maps?file=api&v=2&key=キー" type="text/javascript"></script> … … <script type="text/javascript"> //<![CDATA[ function test(){ … } … … //]]> </script> </body> </html> のfunction test()に飛ばせる？ような方法はありますでしょうか？ メインのhtmlはjavascriptで天気情報はPHPで作っています。 プログラム初心者なんであまり説明がうまくなくすみませんが分かる方がいらっしゃいましたらご教授の方よろしくお願いします。
- ベストアンサー
- PHP
- inputの中身を書き換える方法について
下記で書き換え実行ボタンを押下すると、初期値1は変更後1に変わるのですが、初期値２と初期値３が変わりませんでした。 そのため、inputの中を書き換えるには、divの場合とは違う書き方をしないといけないのかと思ったのですが、どのように記述すればよいかわからなかったのでアドバイスいただける方がいらっしゃいましたら、ご教示の程、よろしくお願いします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script language="JavaScript" type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> <!-- $(function(){ $("#change").click(function(){ $("#text1").html("変更後１"); $("#text2").html("変更後２"); $("#text3").html("変更後３"); }); }); // --> </script> <title>title</title> </head> <body> <form> <input id="change" type="button" value="書き換え実行" /> </form> <br /> <div id="text1">初期値１</div> <input type="text" name="text2" id="text2" value="初期値２" /> <input type="hidden" name="text3" id="text3" value="初期値３" /> </body> </html>
- ベストアンサー
- AJAX
- JavascriptでValueを変えるには
再び質問致します。getElementByIdを前回の質問から学ばせて頂きました。やりたいことはTagの値の変更です。 以下のスクリプトでgetElementByIdはアラートが出ますので存在し値もあっている訳ですが代入が出来ません。ReadOnlyをはずしても駄目です。何かが間違っていると思います。宜しく御願い致します。 <html> <head> <title>エレメントの表示</title> </head> <script type="text/javascript"> function Disp_change() {function SchDefult_Disp_change() { alert("in1"); if (document.getElementById("SchDefult").value == 'Only For' ) { alert( "必須入力です " )}; SchDefult.value = "in1"; SchDefult = "in1"; } </script> <body> <div class="frameHead frameDetail"> <div class="inC1">連絡情報</div> <div class="clear"><hr /></div> <div class="inC2"> <input class="button3" type="button" name="fromUserList" value="" onclick="Disp_change()"> <input class="inIPC2 " type="text" id="SchDefult" name="parent" value="Only For"> </div> <script type="text/javascript"> Disp_change(); }; </script>
- ベストアンサー
- Java
- XHTMLとJavascript・CSSで表示位置の固定方法について
HTMLからXHTMLへソースをそのままで移行したら位置の固定がされなくなりました。 <div id="msg">message</div>の部分をスクロールしても常に同じ場所に表示したいです。 XHTMLの知識が殆どなく、原因が判りません。 Javascriptを別ファイルにしても動きませんでした。 修正方法、もしくは代替案をお願いします。 宜しくお願いいたします <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="content-script-type" content="text/javascript" /> <script type="text/javascript"> var offX = 0; var offY = 0; function setMenu(){ if(document.all){ var mx = parseInt(document.body.scrollLeft+offX); var my = parseInt(document.body.scrollTop+offY); } else { var mx = parseInt(self.pageXOffset+offX); var my = parseInt(self.pageYOffset+offY); } if(document.getElementById){ document.getElementById('msg').style.left=mx; document.getElementById('msg').style.top=my; }else if(document.all){ document.all('msg').style.pixelLeft=mx; document.all('msg').style.pixelTop=my; }else if(document.layers){ document.layers['msg'].moveTo(mx,my); } } onscroll = setMenu; onresize=setMenu; //--> </script></head> <body bgcolor="#111144"> <div id="msg"> message </div> </body> </html>
- ベストアンサー
- JavaScript
- jquery、javascriptについて
あるdivエリア内をクリックすると、特定のチェックボックスに チェックが入るということをしています。 （チェックボックスにチェックを入れるとdiv内の色が変わります。） つまり、divとチェックを連動させたいのです。 その部分は下記でできたんですが、 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <script src="js/jquery-1.2.6.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ $("div#first").mouseover(function() { $(this).css("cursor","pointer"); }).click(function(){ $("input.first").attr("checked","checked"); $("div#first").css("background-color","#FF0000"); }); $("input.first").click(function(){ $("div#first").css("background-color","#CCCCCC"); }); }); $(function(){ $("div#second").mouseover(function() { $(this).css("cursor","pointer"); }).click(function(){ $("input.second").attr("checked","checked"); $("div#second").css("background-color","#FF0000"); }); $("input.second").click(function(){ $("div#second").css("background-color","#CCCCCC"); }); }); </script> </head> <body> <div id="first" style="width:20px; height:20px; background-color:#CCCCCC" >1</div> <div id="second" style="width:20px; height:20px; background-color:#CCCCCC">2</div> <input class="first" name="test" type="checkbox" value="" /> <input class="second" name="test" type="checkbox" value="" /> </html> 全部で、その組み合わせを10箇所作りたいのですが、 function?を単純に10個複製すればできますが、 もっと簡単にまとめる方法はないのでしょうか？ さらに贅沢をいうと、 <div>と<input>は上記では、first,secondのように、id,class名で あわせてますが、ポジションなどで連動できるともっといいです。 1番目のdivをクリックしたら、inputの一番目にチェックのようなことです。 そんなことができるのでしょうか？ 具体的に教えていただけると幸いです。 よろしくお願いいたします。
- ベストアンサー
- JavaScript
