使用jQuery + PHP进行ajax调用的示例应用程序：

Question

我们有一个大的PHP系统，我正在改为OOP，并希望使用AJAX来更新登录用户的网页。我完全是自学成才，并且对HTML，CSS和PHP有很好的理解。

尝试用PHP学习AJAX正在打败我。在尝试了一组自制的脚本来测试无法正常运行的AJAX之后，我就去了互联网上寻找示例而无法使用它。这是在我的开发Mac上运行MAMP并使用我的主机保存当前系统。

我的问题是，是否有任何人有一套简单的“hello world”HTML和PHP脚本，他们知道我可以尝试确认我可以运行已知的东西。

非常感谢科林

Answer 1

如果您打算使用AJAX，我建议您也使用jQuery。这极大地简化了流程，跨浏览器测试并具有许多易于使用的包装函数。

它就像创建名为 hello.php

的PHP页面一样简单

<?php
  echo "Hello World";
?>

然后在您的主页面中，您将需要获取jQuery库并将其连接到文档就绪事件。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
     $(function(){
       $.get("hello.php", function(data){
           alert(data);
       });
    });
</script>

这本质上是我所知道的最简单的AJAX hello world教程：）

Answer 2

不，不是真的，但我建议你使用jQuery，如果你要做任何ajax。它会让你的生活变得更加轻松。

特别是因为所有浏览器都没有以相同的方式实现ajax。

使用jQuery + PHP进行ajax调用的示例应用程序：

我将假设你已经有了一些基本的html文档，我只是要包含重要的内容..

receiver.php：

<?php
echo 'you just received me, I\'m some PHP code and ajax is definitely working...';
?>

sender.html：

<p>Hello, click this button: <a id="button" href="receiver.php">Click me</a></p>
<p id="container"><!-- currently it's empty --></p>

<!-- including jQuery from the google cdn -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>

<script type="text/javascript">
// This is our actual script
$(document).ready(function(){
    $('a#button').click(function(){
        $.ajax({
            url: this.href,
            type: 'GET',
            dataType: 'html',
            success: function (data) {
                $('#container').html(data);
            }
        });
    });
});
</script>

这应该是基本ajax应用程序所需的全部内容......

Answer 3

我建议使用jQuery's AJAX methods，它们是跨浏览器且易于使用。

Answer 4

这是一个使用jQuery的基本示例，将表单中的值发布到单独的PHP文件中验证并返回结果。

<强> form.php的

<html>

<head>
<title>Simple JQuery Post Form to PHP Example</title>
</head>

<body>

<!-- including jQuery from the google cdn -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js">      </script>

<!-- This div will be populated with error messages -->
<div id="example_form_error"></div>

<!-- This div will be populated with success messages -->
<div id="example_form_success"></div>

<!-- Here is your form -->
<div id="example_form_enter">
    <form id="contact_modal_form" method='post' action='form_post.php'>
            <label for="Name">Enter Your Name (Not "Adam"):</label> <input class='textbox' name='Name' type='text' size='25' required />
            <button class='contact_modal_button' type='submit'>Send</button>
    </form>
</div>

<!-- This div contains a section that is hidden initially, but displayed when the form is submitted successfully -->
<div id="example_form_confirmation" style="display: none">
    <p>
        Additional static div displayed on success.
        <br>
        <br>
        <a href="form.php">Try Again</a>
    </p>
</div>

<!-- Below is the jQuery function that process form submission and receives back results -->
<script>
    $(function() {
        $("#contact_modal_form").submit(function(event) {
            var form = $(this);
            $.ajax({
                type: form.attr('method'),
                url: form.attr('action'),
                data: form.serialize(),
                dataType: 'json',
                success: function(data) {
                    if(data.error == true) {
                        var error = $("#example_form_error");
                        error.css("color", "red");
                        error.html("Not " + data.msg + ". Please enter a different name.");
                    } else {
                        $("#example_form_enter").hide();
                        $("#example_form_error").hide();
                        $("#example_form_confirmation").show();

                        var success = $("#example_form_success");
                        success.css("color", "green");
                        success.html("Success! You submitted the name " + data.msg + ".");
                    }
                }
            });
            event.preventDefault();
        });
    });
</script>

</body>

</html>

<强> form_post.php

<?php

    // Request Post Variable
    $name = $_REQUEST['Name'];

    // Validation
    if($name == 'Adam') {
    echo json_error($_REQUEST['Name']);
    } else {
    echo json_success($_REQUEST['Name']);
    };

    // Return Success Function
    function json_success($msg) {
        $return = array();
        $return['error'] = FALSE;
        $return['msg'] = $msg;
        return json_encode($return);
    }

    // Return Error Function
    function json_error($msg) {
        $return = array();
        $return['error'] = TRUE;
        $return['msg'] = $msg;
        return json_encode($return);
    }

?>

Answer 5

if(!$mail->Send()) {
    //echo "Mailer Error: " . $mail->ErrorInfo;
    $data[0]=array('result'=>'Mail not send');
}elseif(!$mail1->Send()){
    //echo "Mailer Error: " . $mail->ErrorInfo;
    $data[0]=array('result'=>'Mail not send');
}else {
    $data[0]=array('result'=>'Mail Send');
}

基本的PHP和AJAX

5 个答案:

使用jQuery + PHP进行ajax调用的示例应用程序：