0

好的，所以我有一个带有表单的基本登录页面：

<form name="register" class="form-horizontal" id="signup" onsubmit="return validateForm(this);" action="check.php">
                <div class="control-group input-append">
                <label for="text" class="control-label">Name</label>
                    <div class="controls">

                                <input id="name" name="name" type="name" placeholder="Enter your name"/> 

                    </div>
             </div>
                 <br>
             <div class="control-group input-append">
                <label for="passwd" class="control-label">Password</label>
                    <div class="controls">

                                <input id="pass" name="pass" type="pass" placeholder="Enter your password"/> 

                    </div>
                </div>
            <br>
            <div class="control-group">
                <div class="controls">
                    <div class="left1">
                        <input type="submit" name="submit" class="btn btn-success"/>
                     </div>
                </div>
                </div>
                <br> 


    </form>

单击提交时，我需要将名称和密码发布到check.php. 我不希望浏览器将页面刷新到check.php.

如果登录成功，它应该获取生成的 JSON 数组，对其进行解析并基于该重定向。

现在我可以发布或获取，但不能两者兼而有之。而且我不希望浏览器将页面刷新到check.php.

更新：

我仍然没有让这个工作。请看一看。

        <form class="form-horizontal" id="login-form">
                <div class="control-group input-append">
                <label for="text" class="control-label">Email</label>
                    <div class="controls">

                                <input name="email" id="email" type="email" value="" placeholder="Enter your email"/> 

                    </div>
             </div>
                 <br>
             <div class="control-group input-append">
                <label for="passwd" class="control-label">Password</label>
                    <div class="controls">

                                <input name="passwd" id="passwd" type="password" value="" placeholder="Enter your password"/> 

                    </div>
                </div>
            <br>
            <div class="control-group">
                <div class="controls">
                    <div class="left1">
                        <input type="button" id="login" value="Login" class="btn btn-success"/>
                     </div>
                </div>
                </div>
                <br>    
        </form>
    </div>
</div>

</body>
<script>



$('#login').click(function(){
    $.ajax({
        url:"login.php",
        type:'POST',
        data: $("#login-form").serialize()
        }).done(function(data){
              alert(JSON.stringify(data)); 
       });
    }
});
</script>
4

2 回答 2

1


试试这个添加 jquery- 1.9.1.js

       <form class="form-horizontal" id="login-form">
            <div class="control-group input-append">
                <label for="text" class="control-label">Email</label>
                <div class="controls">
                    <input name="email" id="email" type="email" value="" placeholder="Enter your email"/> 
                </div>
            </div>
            <br>
            <div class="control-group input-append">
                <label for="passwd" class="control-label">Password</label>
                <div class="controls">
                    <input name="passwd" id="passwd" type="password" value="" placeholder="Enter your password"/> 
                </div>
            </div>
            <br>
            <div class="control-group">
                <div class="controls">
                    <div class="left1">
                        <input type="button" id="login" value="Login" class="btn btn-success"/>
                    </div>
                </div>
            </div>
        </form>

<script>
$('#login').click(function(){
    $.ajax({
        url:"login.php",
        type:'POST',
        dataType:"json",
        data: $("#login-form").serialize()
    }).done(function(data){
        var json_text = JSON.stringify(data, null, 2);
        obj = JSON.parse(json_text);
        if(obj.status == 'done') 
            alert('you are logged in'); 
    });
});
</script>

在登录页面中像这样使用

    <?php 
    $login = $_POST['email']; 
    $pass = $_POST['passwd'];
// LOGIN CHECKING 
    $data['status'] = 'done';
    echo json_encode($data);
    ?>
于 2013-09-26T12:03:32.400 回答
0

由于您不希望页面重新加载，因此我会使用 ajax 将其发布到处理登录的 php 脚本中。

<form id="login-form">
    <input type="text" name="user_name" value=""/>
    <input type="password" name="password" value=""/>
    <input type="button" id="login" value="Login"/>
</form>

那么我建议你使用 jquery 来简化 ajax 处理。它应该看起来像这样：

  $('#login').click(function(){
    $.ajax({
        url: PHP_PAGE_THAT_HANDLES_LOGIN.php,
        type:'POST',
        data: $("#login-form").serialize()
        }).done(function(data){
               /* Here you will recieve the data that 
               *  has been returned from the php page.
               *  so if its a success you can redirect 
               *  here with a window.location = "www.site.com/welcome.php";
               */
       });
    }
});

在参数数据下的 ajax 调用中添加的属性将在 php 页面中接收为 $_POST["user_name"] 和 $_POST["password"]

于 2013-09-26T12:11:19.080 回答