无法用ajax读取php文件输出

时间:2014-01-24 08:46:37

标签: javascript php jquery html ajax

我正在尝试将表单中的变量提交到php文件的ajax请求,并将php文件的内容输出到div。

这是我的主文件:

<div>
    <form name="zipform">
        <p style="color:#cccccc;">Enter your Zipcode: <br><input type="text" name="zipcode">
            <input type ="Button" Value="Search Providers" onClick="showAndClearField(this.form)">
        </p>
    </form>
</div>
<div id="result"></div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
function showAndClearField(frm)
{
var zip = frm.zipcode.value;
    frm.zipcode.value = "";

    $.ajax({
        url: "testphp.php?zipcode="+zip,
        success: function (data) {
            document.write("content of the executed page: " + data);
            $("#result").html(data);
        },
        error: function (xhr, status, error) {
            if (xhr.status > 0) document.write("got error: " + status);
        }
    });
}
</script>

这是testphp.php文件:

<?php
$zipcode = $_GET["zipcode"];
echo '<div><p>'.$zipcode.'</p></div>';
?>

以上结果为“获取错误:错误”的空白页

我做错了什么?

2 个答案:

答案 0 :(得分:0)

你可以做..

<?php

 if (isSet ($_GET ['zipcode']))
 {
    $zipcode = $_GET["zipcode"];
    echo '<div><p>'.$zipcode.'</p></div>';
    exit;
 } 
?>

HTML

<div>
    <form name="zipform">
    <p style="color:#cccccc;">Enter your Zipcode: <br><input type="text" name="zipcode" id='zipcode'>
        <input type ="Button" Value="Search Providers" id="getZip">
    </p>
    </form>
</div>
<div id="result"></div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>

$(document).ready (function (){

    $("#getZip").on ("click", function (e){
        var zip = $("#zipcode").val ();

        $.ajax({
            url: "test1.php",
            data: {zipcode: zip},
            type: "GET",

            success: function (d) {
                document.write("content of the executed page: " + d);
                $("#result").html(d);
            },

            error: function (xhr, status, error) {
                if (xhr.status > 0) document.write("got error: " + status);
            }
        });

        e.preventDefault;
    });
 });
</script>

有点我这样做,但它创造了奇迹。

答案 1 :(得分:-2)

尝试$.get
这更容易了

$.get(
   'testphp.php',{'zipcode':zip}
).done(function(data)
{
$("#result").html(data);
})

你想要不带var的send get方法