もうすぐです。 w3schoolsの例を使用しているようです。そのサイトが常に最も信頼できる情報源とは限らないことに注意してください。詳細は、http://w3fools.com/を参照してください。
再び自分のコードの上に見て、それが自分のページから取られて:
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();
あなたが見ることができるように、「成功時に」コードがonreadystatechange
イベントハンドラ内に配置されています。あなたのコード例には、変数を渡す方法と2つの方法(this
)と、3つの問題があります.3つは、応答ハンドラが期待どおりに動作しないことです。 this
の面で
var xmlhttp;
var var1 = 'testdata';
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
handleAjaxResponse(responseText);
}
xmlhttp.open("GET","ajax_info.php?var1="+var1,true);
xmlhttp.send();
function handleAjaxResponse(resp) {
document.getElementById("myDiv").innerHTML=resp;
}
、それは実行の現在の範囲、全く異なる対象を指します。これはAJAX経由で渡す変数ではありません。
学習の練習としてこれをやっていない限り、頑丈なjavascriptライブラリ(例:Dojo、jQuery)の使用をお勧めします。彼らは、ブラウザの違いを抽象化し、より洗練された呼び出しインタフェースを提供するajax機能を提供します。 – ewh