0

そこには非常にチュートリアルがあり、同じ質問もあることは知っていますが、何度も試しましたが、ajaxは機能しませんでした。plzは私のスクリプトを修正します：ここにindex.phpがあります

<?php
echo'
<script type="text/javascript">
function ajax()
{
var xmlhttp;

xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("result").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("POST","ajax.php",true);
  xmlhttp.send();

    }
</script>

</head>

<body>
<p>&nbsp;</p>
<form id="form1" name="form1" method="post" action="" onsubmit="return ajax()">
  <p>
    <label for="num2">number 1</label>
    <input type="text" name="num1" id="num2" />
    *
  <label for="num3">number 2</label>
  <input type="text" name="num2" id="num3" />
    =
  <label for="result">Result</label>
  <input type="text" name="result" id="result" />
  </p>
  <p>
    <input type="submit"  value="Submit" />
  </p>
</form>';
?>

これがajax.phpで、2つの変数を取り、それらを乗算して結果をエコーし​​ていますが、私のページは参照して何も表示されませんでした

    <?php
    $num1=$_POST["num1"];
    $num2=$_POST["num2"];

    $result=$num1*$num2;
    echo $result;
?>
4

2 に答える 2

1

これは、function ajax()何も返されないため、フォームが引き続き送信されるために発生します。

関数が終了する前に追加return false;

正しいコード：

<html>
<head>

<script type="text/javascript">
function ajax(){
    var xmlhttp;
    xmlhttp=new XMLHttpRequest();
    xmlhttp.onreadystatechange=function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            document.getElementById("result").value=xmlhttp.responseText;
        }
    }
    var params = "num1="+document.getElementById('num2').value+"&num2="+document.getElementById('num3').value;
    xmlhttp.open("POST","ajax.php",true);
    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xmlhttp.setRequestHeader("Content-length", params.length);
    xmlhttp.setRequestHeader("Connection", "close");
    xmlhttp.send(params);
    return false;
}
</script>

</head>

<body>
    <p>&nbsp;</p>
    <form id="form1" name="form1" method="post" action="" onsubmit="return ajax()">
        <p>
            <label for="num2">number 1</label>
            <input type="text" name="num1" id="num2" />
            *
            <label for="num3">number 2</label>
            <input type="text" name="num2" id="num3" />
            =
            <label for="result">Result</label>
            <input type="text" name="result" id="result" />
            </p>
            <p>
            <input type="submit"  value="Submit" />
        </p>
    </form>
</body>
</html>
于 2012-09-26T09:31:45.710 に答える
0

とでajaxを使用する同様の行に関する質問に対する私の答えをここで確認してください。お役に立てば幸いです。完全なコードについて詳しく説明しています。phpmysql

その多くはここでも当てはまります。

お役に立てれば。

于 2012-09-26T09:34:58.910 に答える