0 
<script type="text/javascript">
document.getElementById('s1').onclick=function()
{
var value1 = document.getElementById('input').value;
var aj;
if(window.ActiveXObject)
{
    aj=new ActiveXObject("Microsoft.XMLHTTP");
}
if(window.XMLHttpRequest)
{
    aj=new XMLHttpRequest();
}
aj.onreadystatechange=function()
{
    if(aj.readyState==4 && aj.status==200)
    {

        document.getElementById("output").innerHTML=aj.responseText;
    }
}
aj.open("GET","tstprinajax.php?name="+value1,true);
aj.send();
}
</script>

これは私にとってはうまくいきません。AJAXでボタンをクリックするだけで、1つのテキストボックスの値を取得し、div名「出力」に出力したい。

HTML コード:

<body>
<form action="">
<input type="text" id="input" />
<button id="s1"></button>
<div id="output"></div>
</form>
</body>

tstprinajax.php:

<?php
$q = $_GET["name"];
print "<font size='+6' color='#FF0000'>$q</font>";
?>
4

1 に答える 1

0

あなたの問題は、要素のデフォルトtypebuttonsubmitが であり、ボタンを含むフォームが（同じページに）送信されているため、ページが更新されていることだと思います。button要素を次のように変更します。

<button id="s1" type="button"></button>

サーバーの応答をハードコーディングすると (JSBin では実際にサーバー側の処理を行うことができず、十分に公平であるため)、その変更を行うとコードが機能します。

実例| ソース

対照的に、なしではtype="button"、代わりにページが更新されます: Live Example

于 2013-03-29T17:12:36.520 に答える