AJAXのような使い方をしたい

このQ&Aのポイント
  • JavaScriptを使用してAJAXのような使い方を実現したい場合、要素のinnerHTMLにAPIのスクリプトを追加しても正常に動作しないことがあります。
  • ソースコードのみが書き換えられてAPIにリクエストが送信されない可能性があります。
  • 間違った記述でない場合は、根本的な課題が存在している可能性があります。
回答を見る
  • ベストアンサー

AJAX?のような使い方をしたい

AJAX?のような使い方をしたいと思い、 javascriptで下記のような記述を行いました。 document.getElementById('id').innerHTML = "<script type='text/javascript' src='api'></script>"; あらかじめ<script type='text/javascript' src='api'></script>を記述しておけば、 正常にapiにリクエストしてくれますが、 無理やりjavascriptで書き換えると、ソースコードのみが書き換えられ、 apiにリスエスとしてくれません。 何か記述が間違っているのでしょうか? それとも根本的に間違っているのでしょうか?

  • ENTRE
  • お礼率0% (16/2523)

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

  • ベストアンサー
  • t_ohta
  • ベストアンサー率38% (5068/13243)
回答No.1

こちらが参考になるのでは。 http://q.hatena.ne.jp/1161158347

関連するQ&A

  • Jqueryのajaxを用いてHTMLの読み込み

    こんにちは。 Jqueryのajaxで広告向けのJavaScriptが記述されたhtmlを取得し、関数【$("#ID").html(htmlソース);】を用いて、HTMLを読み込んだ際に、それに記述されているJavaScriptが動作してくれません。 読み込むHTMLに記述されているJavaScriptは以下です。 <script type="text/javascript" src="//xml.affiliate.rakuten.co.jp/widget/js/rakuten_widget.js"></script> ご存知の方がいらっしゃいましたら、教えて頂きたいです。

  • ajaxでエラー処理

    お世話になります。 prototype.jsを使ってajaxのエラー処理を考えております。 そこで質問なのですが、以下のソースで OK.phpでは正常に処理が行われ、 NG.phpでは強制的にonFailure処理を行わせたいと考えております。 PHP側(NG.php)で、操作出来ませんでしょうか? よろしくお願いいたします。 <html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript"> <!-- function ajax(fName) { var filename = fName + "?cache="+(new Date()).getTime(); new Ajax.Request(filename, { method: "get", onSuccess: displayData, onFailure: displayError }); } function displayData(httpObj) { $("result").innerHTML = httpObj.responseText; } function displayError(httpObj) { $("errMsg").innerHTML = httpObj.responseText; } // --> </script> </head> <body> <input type="button" value="正常処理" onClick="ajax('OK.php')"><br> <input type="button" value="エラー処理" onClick="ajax('NG.php')"><br> <div id="result"></div> <div id="errMsg"></div> </body> </html>

  • Google AJAX API のmapsのロードとIEでの表示について

    いつもお世話になっています。 Google AJAX APIについて質問です。 デベッロッパーガイドに従って以下のようにスクリプトを書いたのですが IEのみエラーが出て表示されません。 (IE7でも表示はされましたが、不安定でした) <html> <head> <script type="text/javascript" src="http://www.google.com/jsapi?key=登録したAPIキー"></script> <script type="text/javascript"> google.load("maps", "2"); function initialize() { var map = new google.maps.Map2(document.getElementById("map")); map.setCenter(new google.maps.LatLng(37.4419, -122.1419), 13); } google.setOnLoadCallback(initialize); </script> </head> <body> <div id="map" style="width: 400px; height: 400px"></div> <div id="searchcontrol"></div> </body> </html> なぜIEだけが表示されないのか、エラーが出るのかわかる方いらっしゃいましたらよろしくお願いします。

  • JpGaph + Ajaxでグラフを疑似ウィンドウで表示したい

    最近Ajaxを始めました。 PHP jpgraphで作成したグラフを、Ajaxで疑似ウィンドウ的に表示したいです。 graph.phpで生成したグラフを<div="graph"></div>に 埋め込む感じで、下記のようなスクリプトを書いてみました。 しかし当然バイナリデータなので、期待するような形で表示されてくれません。 どうしたらいいのか皆目検討がつかず、困っています。 ご存じの方、どうぞよろしくお願いいたします。 <html> <head> <script src="../../js/prototype.js" type="text/javascript"></script> <script type="text/javascript"> function showGraph(){ uri = "graph.php"; options = {onComplete: function(req){$("graph").innerHTML=req.responseText;}}; new Ajax.Request(uri, options); } </script> </head> <body> <input type="button" value="click" onClick="showGraph()"> <div id="graph"></div> </body> </html>

    • ベストアンサー
    • PHP
  • Ajaxのエンコードで

    私はshift_JISで作成したCGIのページがあるのですが、 Ajaxを導入しようとしたときに、Ajaxというか Javascriptでは、utf-8しか認識しないととあるサイトに書いてあったのですが、 そのCGIのページをphpに変更するにはものすごく多大な時間が 必要になってしまうんですが、CGIをutf-8仕様にするのも大変です AjaxでShift_JISに変換するような事はできませんでしょうか? http://javascriptist.net/ref_prototype/ajax.periodicalupdater.html のサイトに乗っている <script type="text/javascript" src="/js/prototype.js"></script> <script type="text/javascript"> var myajax; function execute() { myajax = new Ajax.PeriodicalUpdater( "container", "./member.cgi", { "method": "get", "parameters": "id=$id", frequency: 5, // 5秒ごとに実行 onSuccess: function(request) { // 成功時の処理を記述 // alert('成功しました'); // jsonの値を処理する場合↓↓ // var json; // eval("json="+request.responseText); // ↓IEでもキャッシュを読み込まずに毎回リモート接続を実行するためのコード(パラメータの書き換え) var str = myajax.options.parameters; var hash = str.parseQuery(); hash["ajax_request_id"] = Math.random(); hash = $H(hash); myajax.options.parameters = hash.toQueryString(); }, onComplete: function(request) { // 完了時の処理を記述 // alert('読み込みが完了しました'); // jsonの値を処理する場合↓↓ // var json; // eval("json="+request.responseText); }, onFailure: function(request) { alert('読み込みに失敗しました'); }, onException: function (request) { alert('読み込み中にエラーが発生しました'); } } ); } </script> を使用して自動更新をしようと思っているのですが

  • JavaScript表示切替の問題

    ボタンを押すたびに、こんにちはとこんばんはが切り替わるようにしたいのですが、 切り替わりません。なぜかわかる方がいたら教えて頂けると助かります。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> </head> <body> <div id="1">こんにちは</div> <input type="button" value="切替" onclick="func_switch()"> <script language="javascript" type="text/javascript"> function func_switch(){ if(document.getElementById(1).innerHTML="こんにちは"){ document.getElementById(1).innerHTML="こんばんは"; } else{ document.getElementById(1).innerHTML="こんばんは"; } } </script> </body> </html>

  • Ajax.RequestでXMLデータをパース

    お世話になります。 Ajax.Requestをして、返ってくるデータがXMLなのですが このXMLをパースして表示したいのですが 何か方法はありませんでしょうか? もしかしたら簡単なことなのかもしれませんが ご存知の方がいらっしゃいましたら ご教授よろしくお願いいたします。 ajax.js //////////// function exec(fname,dispArea) { var httpObj = new Ajax.Request(fname, { method:'GET', onSuccess:function(req) { var text = req.responseText; $(dispArea).innerHTML = text; } } ); } ///////////test.html <script language="javascript" type="text/javascript" src="prototype.js"></script> <script language="javascript" type="text/javascript" src="scriptaculous.js"></script> <script language="javascript" type="text/javascript" src="ajax.js"></script> <span id="disp">exec('hoge.xml', 'disp');</script></span> //////////// hoge.xml <?xml version="1.0" encoding="UTF-8"?> <?xml-stylesheet type="text/xsl" href="hoge.xsl" ?> <top> <list> <row>テスト1</row> </list> <list> <row>テスト2</row> </list> <list> <row>テスト3</row> </list> </top> //////////// hoge.xsl <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="top"> <html><title>XMLパース</title> <body> <xsl:for-each select="list"> <xsl:value-of select="row" /> </xsl:for-each> </body> </html> </xsl:template> </xsl:stylesheet>

  • 3重のクォーテーション

      javascriptで function textChange(id,text){ document.getElementById(id).innerHTML=text; return document.getElementById(id).firstChild.nodeValue; }   と関数を作っておいて、 <span onClick="textChange('indication_space','★')">メールアドレス</span>   の★の部分に <script type="text/javascript" src="メールフォームのURL" charset="utf-8"></script>   という文字を入れたいのですがクォーテーションが重なっているためエラーが出ます。 ★内の「"」を「\'」とした場合、エラーは出ませんが何も表示されませんでした。 解決法をご存知の方いらっしゃいましたらぜひご教授ください。 よろしくおねがいします。

  • innerHTMLで、関数での記載内容を希望のエリアに表示したい。

    お世話になります。 下記のように行うと、 「実際は、いろいろと表示したい」 が、 「aaaaaaaaaaaaaaaaaa」 の下に表示されてしまいます。 また、 <div id="DspArea"> の位置には、undefined と、表示されてしまいます。 document.getElementById("DspArea").innerHTML="tst"; とすれば、 <div id="DspArea"> の位置に正確に表示されます。 innerHTMLで、関数で記載したタグを含む文字列を表示させるには何か気をつけなければならないことがあるのでしょうか。 よろしくご教示お願いします。 <script type="text/javascript"><!-- function dspTst(){ document.write('実際は、いろいろと表示したい'); } // --> </script> <div> <div id="DspArea"> </div> <div> aaaaaaaaaaaaaaaaaaaa </div> </div> <script type="text/javascript"><!-- document.getElementById("DspArea").innerHTML=dspTst(); // --> </script>

  • Javascriptで文字の書き換え

    現在、IE8とChromeを使用しています。 どちらのブラウザで試してもdocument.write("文");は読み込みますが <id>で指定したタグの中身が変わりません。 javascriptに書いたinnerHTML及びinnerTextの使い方か、もしくは、 根本的なところを何処か間違っているでしょうか? -----------HTML文------------------------------------------------------ <!doctype html> <html lang="ja"> <head> <meta charset="utf-8"> <title>2011_09_02_1</title> <link rel="stylesheet" href="2011_09_02_1.css"> <script type="text/javascript" src="2011_09_02_1.js"></script> <body> <div id="str"><h3>Good morning</h3></div> </body> </html> ---------------外部CSS文----------------------------------------------- div h3{ color:#0000ff; } ---------------外部javascript文------------------------------------------ //タグを含む書き換え用ソース document.write("読み込むかテスト"); var chenge; chenge = document.getElementById(str); chenge.innerHTML = "Good Night"; ---------------------------------------------------------- //下は後から試した文--------文字のみ書き換え用ソース document.write("読み込むかテスト"); //document.getElementById("str").innerText = "Good Night"; --------------------------------------------------------------------------

専門家に質問してみよう