JQueryでのAJAXで困ってます
- JQueryを使ったAJAXで困っています。ブラウザの違いによってJQueryのloadの動作が異なるため、IE以外で正しく動作させる方法を教えてください。
- 最近JQueryを学び始め、AJAXに興味を持ちました。特に、JQueryでdiv要素を使ってメニューを選択し、別のdiv要素に内容を表示する方法について困っています。IEでは正しく表示されるのに、FirefoxやOperaではJavaScriptが動作しないなどの問題があります。
- JQueryのload関数を使用してdiv要素の内容を非同期で読み込んでいますが、ブラウザの違いによって動作が異なります。特に、FirefoxやOperaでは新しく表示した部分のJavaScriptが動作せず、ChromeではCSSも適用されません。IE以外でも正しく動作させる方法を教えてください。
- ベストアンサー
JQueryでのAJAXで困ってます
最近AJAXを勉強しようと思い、JQueryに手を出しました。 JQueryで画面遷移無しでdivで作ったメニューを選択して内容を指定したdivに表示させようと思っているのですが、 JQueryでのloadの動作がブラウザの違いで異なる動きをするので困ってます。 IEでは内容が表示されて、新しく表示した部分のJavaScriptが正しく動くのでいいのですが、 Firefox、Operaでは新しく表示した部分のJavaScriptが動作しません。 Chromeでは新しく表示した部分のCSSでさえ適用されません。 IE以外でも正しく動作させるにはどうしたらいいでしょうか？ ご回答、よろしくお願いします。
- outer323
- お礼率100% (1/1)
- AJAX
- 回答数1
- ありがとう数2
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
jQueryはクロスブラウザで動作するので、どのブラウザでも同じように動作すると思います。 もし宜しければ、JavaScriptをどのように記述されているか教えてもらえませんか？
関連するQ&A
- jQueryでajax
ajax（jQuery使用）を使った以下のサンプルは、 セレクトボックスを選択すると、ボタンを表示するのですが、 そのボタンをクリックしても、アラート（This is success!）が表示されません。 ajaxで吐き出した<button>ボタン</button>のボタンのクリックイベントが 検知しないような感じですが、いったいどこが間違っているのかわかりません。 どなたか、ご教授いただけると助かります。 htmlソース ------------------------------------------- <meta http-equiv="content-script-Type" content="text/javascript" /> <meta http-equiv="content-style-Type" content="text/css" /> <link rel="stylesheet" href="./photo.css" media="all" /> <title> テスト</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("button").click(function() { alert("Test is success!"); }); $(".first").change(function() { var param = ''; $.ajax ({ type: "POST", url: "ajax.php", data: param, cache: false, success: function(res) { $("#result").html(res); } }); }); }); </script> </head> <body> <select name="first" class="first" id="first"> <option value="1">項目１</option> <option value="2">項目２</option> </select> <p>結果：</p> <div id="result" style="width:808px;"></div> </body> </html> phpソース ---------------------------------------- <?php echo '<button>ボタン</button>'; ?>
- ベストアンサー
- AJAX
- IEにおいてjqueryが動いてくれません
初めて投稿させていただきます。 只今、jqueryを使用してjavascriptを書いているのですが、firefoxでは正しく動作するのに、IEでは動作してくれないのです。是非この問題を解いてください。 私のやろうとしていることは、画面遷移をなくしてコンテンツ部分の情報を変えていきたいと思っているのですが、コンテンツ部分は別ファイルにて記述し、インデックスページから$(～).load(～)や、$.get(～)を使用して呼び出しているのです。 呼び出すファイルはphpで、その中にはphpとjavascript、コンテンツ部分のhtmlが記述されています。 firefoxでそれを動作させたところ、phpもjavascriptもhtmlも問題なく動作してくれるのですが、IEで動作させたところ、どうやらjavascriptが動いていない模様なのです。 IEの場合、$(～).load(～)で呼び出すと、javascriptは解釈してくれないのでしょうか？ご回答よろしくお願いいたします。
- 締切済み
- JavaScript
- IEでのjQuery の実装について
教えてください。 現在、jQuery の jqplot を利用してグラフの表示を検討しております。 HTML（ブラウザ：IE,chrome）での表示は問題なく行われますが、 HTMLをASPファイル内に組み込んでページを表示させようとすると chromeでは問題なくグラフが表示されますが、IEではエラーが発生します。 IEでも動作するようにするためのアドバイスをお願いします。 以下、ロジックです。 <!-- jQuery グラフ表示部 ここから --> <script language="javascript" type="text/javascript" src="../jQuery/jquery-1.9.0.min.js"></script> <!--[if lt IE 9]> <script language="javascript" type="text/javascript" src="../jQuery/excanvas.min.js"></script> <![endif]--> <script language="javascript" type="text/javascript" src="../jQuery/jquery.jqplot.min.js"></script> <script language="javascript" type="text/javascript" src="../jQuery/jqplot.barRenderer.min.js"></script> <script language="javascript" type="text/javascript" src="../jQuery/jqplot.categoryAxisRenderer.min.js"></script> <link rel="stylesheet" type="text/css" href="../jQuery/jquery.jqplot.min.css" /> <script> jQuery( function() { jQuery . jqplot( 'jqPlot-sample', [ [ [ '4月', 65 ], [ '5月', 72 ], [ '6月', 74 ], [ '7月', 63 ], [ '8月', 85 ], [ '9月', 90 ] ] ], { animate: true, seriesDefaults: { renderer: jQuery . jqplot . BarRenderer, }, axes: { xaxis: { renderer: jQuery . jqplot . CategoryAxisRenderer, } } } ); } ); </script> <!-- jQueryグラフ表示部 ここまで --> html部分 <div id="jqPlot-sample" style="height: 300px; width: 300px;"></div>
- 締切済み
- JavaScript
- JQueryのajax()がIE8でエラー
JQueryのajax()で非同期通信を行うとfirefoxではsuccessのイベントへ行くのですが、 IE8で実行するとerror側へ行ってしまいます。 実行しているJavascriptは全く同じです。 またerror時にerrorThrownの中にはno transportと入っていました。 ブラウザによって挙動が変わってしまう理由をご存知でしたらお教え願います。
- 締切済み
- JavaScript
- jQueryにて背景のURLを取得
jQueryにて背景のURLを取得しimgを表示する場合で背景を縦横の倍率を50％に縮小するにはjavascriptをどうすればいいのでしょうか？ 【javascript】 jQuery(function($){ var ori_img = $("#crop_img"); crop_window.css({'background-image': 'url('+ori_img.attr('src')+')'}); }); 【HTML部分】 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <div id="crop"> <img src="./test.jpg" id="crop_img" alt="" > <div id="crop_window"></div> </div>
- ベストアンサー
- AJAX
- JQueryはAJAXとは無関係？？
質問◆JQueryおよびJQueryMobileは「AJAX」とは無関係なのでしょうか？ 「JQueryMobileを使っているとき、DOMによってHTMLを動的に差し替えている」という認識なのですが、 特にRequest関連の記載をJavaScriptで記載していない限り、AJAXの処理は行われないのでしょうか？ それとも、 JQuery Mobileを使っている場合は、ページ遷移などで、プログラマが意識していなくても（独自にプログラムを書いていなくても） AJAXの処理が行われているのでしょうか？ /************************************/ サーバへのリクエストはなくても、１つのマシン内の、HTMLファイルとHTMLファイルの間で、 HTTPで通信がされるということはないと思っています。 （※基本、HTTPはクライアントとサーバの間のときしか使われないのですよね？） JQueryの技術情報のサイトを見ていると、 よく「document.ready」と書かれていたりするソースを見かけますが、 これはAjaxとは関係なく（通信とは関係なく）、 また「xhr.send」も書かれていないHTMLは、AJAXは使われないという理解です。 （「Form、submit」とも関係がない） XMLHttpRequestも「HttpRequest」とあるわけですし、 「Form、submit」を書いているときに行われるわけではないけれども、かわりに、 「xhr.send」とJavaScriptで実行されたタイミングで走る処理であり、 その際、「サーバから返される情報がXMLのデータ形式で(XML以外もですが、、)」だという理解なのですが、合っていますでしょうか？
- ベストアンサー
- AJAX
- wordpress ＋ jqery ＋ IE8
wordpress jquery ie8 --- wordpressを使い、ブログを管理しています。 wordpressに、jqueryを導入しました。 導入した、jqueryは、これ。 ・wp-jquery-lightbox --- ブラウザは、Opera・オペラ バージョン11.00 を使用しています。 Operaでは、jqueryが、効く・有効なのです。 他、firefox・Chromeでも、jqueryは、有効です。ちゃんと、動いてくれます。 けれど、IE8で確認すると、jqueryは、上手く、動きません。 そこで、別のサイトに、新たにhtmlサイトを作り、 IE8で、jqueryの動作をテスト・確認すると、 jqueryは、動いてくれました。 けれど、IE8で、wordpressのサイトの、jqueryを確認すると、 動いてくれません。 wordpress + jquery + IE8 →jqueryは、動かない・見れない。 通常の、javascriptは、動く。何故か、jqueryは、動かない。 の組み合わせの時に、見れない、動作しない様です。 htmlだけ + jquery + IE8 →jqueryは、動く・見れる。 では、動作します。 --- wordpress + jquery の組み合わせの時は、「jquery」は、 Opera・firefox・chromeは、見れる。IEは、見れない・動かない。 動かないのは、jqueryのプログラムだけで、通常の閲覧は可能です。 けれど、単なる、html ＋ jquery の時は、動く。 どうすると、 「wordpress ＋ jqery」 を、 「IE8・IE系」でも、「動く・見れる」様に出来るのでしょうか。 ご教授下さい。 よろしくお願いします。
- ベストアンサー
- JavaScript
- ajax後、php,mysqlも一部再読み込み？
通常は一部でも変更が加わるとページの全てを再読み込みしますが、ajaxを利用すると、変更を加えた部分だけが再読み込みされるところまでは理解しています。 分からないところは、各プログラムへの動作がajaxを使った後の場合と通常の場合ではどのように違うのかです。 下記のような考え方で正しいですか？説明が下手で読みにくく申し訳ないですが、アドバイスをいただけたら嬉しいです。お願いします。 ■htmlは、実行を起こした部分を含めその子要素全てが再読み込みの対象に。 例えば、↓の<div#ajax>～</div>この間にある子要素の全てが再読み込みされる。それ以外のhtmlやcssは再読み込みされない。 ■cssは、htmlと同じで、その部分で使われているcssが対象。 ■javascriptは、ajaxの場合と通常の場合で違いはなく、常に全てが再読み込みされる(外部ファイル、記述の位置に関係なく)。 ■jquery、php、mysqlも、javascriptと同じで何一つ変わりなく通常通りに動く。 <?php ・includeで外部ファイルを取得 ・様々な処理 ・mysqlに接続して様々な処理 ?> <html> <head> <script type="text/javascript" src="外部ファイルでajaxを記述"></script> <title></title> </head> <body> <?php ・様々な処理 ?> <div id="main"> <div id="a"> <dl>～</dl> </div> <div id="ajax" onclick="ajaxの処理へ"> <table>～</table> <ul>～</ul> その他様々な処理 </div> <p>～</p> <img src=""> </div> <script type="text/javascript"> </script> </body> </html>
- ベストアンサー
- AJAX
- jQueryはhtml要素を扱うだけ？
javascript(jQuery)初心者です。 jQueryでStringは扱えず、javascriptとjQueryのどちらを使えばよいか混乱しています。 javascriptのobjectやstringは、jQueryでは扱わない、と考えとけば良いのでしょうか？ 扱うのは、html要素・ajax・css 暇な時にでも。 よろしくお願いします。
- ベストアンサー
- JavaScript
- CGIなのにIE8のときキャッシュが残ってしまう
jQueryの$.ajaxでPerl/CGIの出力結果を参照し、JavaScriptでそれを元に処理をしているのですが、XP/IE8環境でキャッシュが残ってしまう現象に遭遇し困っています。CGIの出力結果の時間に関係する処理なので、HTML上でタイムリーな表示にならず、とても困っています。Chrome、Firefox、Opera、Safariでは正常に動作しているのですが、IE8では動的であるCGIもキャッシュに残して参照する仕様になっているのでしょうか。
- ベストアンサー
- CGI
お礼
すいません。 自己解決してしまいました。 どうやら、loadの後に外部jsファイルとしてJavaScriptを読みんだ結果、FirefoxやOperaでもIEと同じ動作してくれました。 ご回答ありがとうございました。