从Javascript调用PHP webservice

时间:2012-03-22 00:46:14

标签: php javascript jquery javascript-events

我是PHP和Javascript开发的新手,我正在尝试执行此代码,但它失败了

<?php
if(isset($_POST['username']) and isset($_POST['password'])) {

 // do logic for logining in (usually query your db)
if ($_POST['username'] == 'test' && $_POST['password'] == 'test') {
$data['success'] = true;
$data['message'] = 'Login succesful';
} else {
$data['success'] = false;
$data['message'] = 'Login failed';
}
// return json
echo json_encode($data);

}
?>

这是Javascript文件

<script>
    $(document).ready(function() {
    alert("dddd");
        $('#loginForm').submit(function() {
            $('#output').html('Connecting....');
            var postTo = 'http://localhost/Login/login.php';
            alert(postTo);
            $.post(postTo,{username: $('[name=username]').val() ,   password: $('[name=password]').val()} , 
                function(data) {

                    if(data.message) {
                        alert(data);
                    } else {
                        $('#output').html('Could not connect');
                    }

                },'json');

            return false;
        });
    });
</script>

请帮助,提前感谢你!

4 个答案:

答案 0 :(得分:1)

假设$data没有在任何地方定义,这应该解决它:

<?php
    $data = Array();
    if(isset($_POST['username']) and isset($_POST['password'])) {

         // do logic for logining in (usually query your db)
        if ($_POST['username'] == 'test' && $_POST['password'] == 'test') {
        $data['success'] = true;
        $data['message'] = 'Login succesful';
    } else {
        $data['success'] = false;
        $data['message'] = 'Login failed';
    }
    // return json
    echo json_encode($data);

    }
?>

答案 1 :(得分:0)

if(isset($_POST['username']) and isset($_POST['password'])) {

应该是

if(isset($_POST['username']) && isset($_POST['password'])) {

作为第一次修正。

答案 2 :(得分:0)

使用Firebug扩展安装Firefox,使用F12打开它,启用“NET”,“SCRIPT”和“CONSOLE”选项卡。使用SCRIPT选项卡在脚本中(在警报(postTo)周围)放置一个断点。刷新页面并逐步执行,监视控制台。使用NET选项卡检查php脚本的请求和响应是否正确。

上面的代码在我的环境中工作(稍微改变警报(数据)到警报(data.message))。以下适用于我:

的login.php:

<?
if(isset($_POST['username']) and isset($_POST['password'])) {
// do logic for logining in (usually query your db)
if ($_POST['username'] == 'test' && $_POST['password'] == 'test') {
$data['success'] = true;
$data['message'] = 'Login succesful';
} else {
$data['success'] = false;
$data['message'] = 'Login failed';
}
// return json
echo json_encode($data);

}
?>

的login.html:

<head>
<script type='text/javascript' src='jq/jquery.js'></script>

<script type='text/javascript'>
    $(document).ready(function() {
        alert("dddd");
        $('#loginForm').submit(function() {
            $('#output').html('Connecting....');
            var postTo = 'http://localhost/login.php';
            alert(postTo);
            $.post(postTo,{username: $('[name=username]').val() ,   password: $('[name=password]').val()} , 
                function(data) {

                    if(data.message) {
                        alert(data.message);
                    } else {
                        $('#output').html('Could not connect');
                    }

                },'json');

            return false;
        });
    });
</script>
</head>

<body>
<form id='loginForm'>
  <input type='text' id='username' name='username'/>
  <input type='text' id='password' name='password'/>
  <button type='submit'>Submit</button>
</form>
</body>

答案 3 :(得分:0)

有趣的是它在Firefox中适用于我。我有一段时间IE的问题,解决方案是将正确的标题添加到PHP脚本的顶部:

<?php
header('Cache-Control: no-cache, must-revalidate');
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
header('Content-type: application/json');
...

编辑:通过从其他计算机调用它来重现它。尝试将var postTo = 'http://localhost/test/test.php';更改为var postTo = 'test/test.php';

这是我测试的内容(我建议您使用firebug和console.log()而不是alert()):

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
 $('#output').html('somestuff');

    $('#loginForm').submit(function() {
        $('#output').html('Connecting....');
        var postTo = 'http://localhost/test/test.php';
        //alert(postTo);
        $.post(postTo,{username: $('[name=username]').val() ,   password:  $('[name=password]').val()} , 
            function(data) {

                if(data.message) {
                   //  console.log(data);
                    $('#output').html('Ya got it: '+ data.message);
                } else {
                    $('#output').html('Could not connect');
                }

            },'json');

        return false;
    });
});
</script>
</head>

<body>
<form id="loginForm">
    <input type="text" name="username" value="test"/>
    <input type="text" name="password" value="test"/>
    <input type="submit"  />
</form>
<div id="output"></div>
</body>