1

正如主题名称所说,我正在尝试使用 jQuery 和 AJAX 将变量从 HTML 表单传递到 PHP 脚本。我以前做过,但今天我无权访问这些文件。PHP 不会打印名字和姓氏。我找到了一些例子,但无论我做什么都是一样的......过去几天我做错了什么?

这是 HTML 代码:

First Name: <br />
<input type="text" name="fname" /><br />
Last name: <br />
<input type="text" name="lname" /><br /><br />
<input type="submit" name="submit" value="Send" />

Javascript(jQuery):

$(document).ready(function(){
    $('input[name="submit"]').click(function(){
        var fname = $('input[name="fname"]').val();
        var lname = $('input[name="lname"]').val(); 

        $.ajax({
            type: 'POST',
            url: 'index.php',
            data: {fname:fname, lname:lname},
            dataType:"json"
        });

    }); 
});

PHP:

if(isset($_POST['fname']) && isset($_POST['lname'])){
    $fname = $_POST['fname'];
    $lname = $_POST['lname'];
    echo $fname;
    echo "<br />";
    echo $lname;    
}
4

2 回答 2

0

将您的 PHP 更改为

if(isset($_POST['fname']) && isset($_POST['lname'])){
    $fname = $_POST['fname'];
    $lname = $_POST['lname'];
    $string = $fname."<br />".$lname;
    echo $string;    
}

和你的 jQuery

$(document).ready(function(){
    $('input[name="submit"]').click(function(){
        var fname = $('input[name="fname"]').val();
        var lname = $('input[name="lname"]').val(); 

        $.ajax({
            type: 'POST',
            url: 'index.php',
            data: {fname:fname, lname:lname},
            success: function(response){
               console.log(response);
               // YOUR OWN LOGIC
               // IE: $('#my_div').append(response);
            }

        });

    }); 
});

或将您的 PHP 更改为

if(isset($_POST['fname']) && isset($_POST['lname'])){
    $response = array();
    $response['fname'] = $_POST['fname'];
    $response['lname'] = $_POST['lname'];
    echo json_encode($response);  
}

和你的 jQuery

$(document).ready(function(){
    $('input[name="submit"]').click(function(){
        var fname = $('input[name="fname"]').val();
        var lname = $('input[name="lname"]').val();

    $.ajax({
        type: 'POST',
        url: 'index.php',
        data: {fname:fname, lname:lname},
        dataType:"json"
        success: function(response){
           response = eval(response);
           console.log('First name:' + response.fname);
            console.log('Last name:' + response.lname);
               // YOUR OWN LOGIC
               // IE: $('#my_div').append('Last name: ' + response.lname);
        }

    });

  }); 
});

我还没有测试过它,但它应该让你走上正确的道路。您还可以使用beforeSenderror/fail回调进行调试,并且不要忘记检查响应(Firebug 非常适合此),它有很大帮助。

于 2013-11-11T20:09:45.780 回答
-1

尝试在您的 ajax 请求中实现“成功”功能。

$.ajax({
            type: 'POST',
            url: 'index.php',
            data: {fname:fname, lname:lname},
            dataType:"json",
            beforeSend: function() {

            },
            complete: function() {

            },
            error: function(xhr, ajaxOptions, thrownError) {

            },
            success: function(result) {
                //-- success! 
                alert('it works!');
            }
        })
于 2013-11-11T20:06:01.840 回答