文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
社区首页 >问答首页 >jQuery Ajax不使用$.ajax()

问jQuery Ajax不使用$.ajax()
EN

Stack Overflow用户
提问于 2016-04-04 05:41:41
回答 7查看 162关注 0票数 0

我正在尝试用它来获取数据并通过jQuery显示它。这是我的剧本

代码语言：javascript
复制
<script>
    $("#kys_SignUp_form").submit(function(event){
    event.preventDefault();

    var $form = $(this);
    var $url = $form.attr('action');
    var $email = $("#email").val();
    var $username = $("#username").val();
    var $password = $("#password").val();

    $.ajax({
          type: 'POST',
          url: $url,
          data: { email: $email, password: $password, username: $username },

          success: function(data) {
                alert("Transaction Completed!");
           }

            });
    });

 </script>

这是我的表格：

代码语言：javascript
复制
 <form role="form" action="kys_SignUp.php" method="post" id="kys_SignUp_form">
   <div class="form-group">
       <label for="email" >Email address:</label>
       <input type="email" style="width: 300px" class="form-control"  name="email" id="email" required>
    </div>

  <div class="form-group">
    <label for="Username" >Username:</label>
    <input type="text" style="width: 300px" class="form-control" name="username" id="Username" required>
   </div>

  <div class="form-group">
     <label for="password" >Password:</label>
     <input type="password" style="width: 300px" class="form-control" id="password" name="password" required>
  </div>

   <button type="submit"  class="btn btn-default">Submit</button>

</form>

我是jQuery的新手。我面临的问题是，即使在使用ajax之后，页面也被重定向到php文件，我认为ajax函数根本没有被调用。

这是我的php文件：

代码语言：javascript
复制
 <?php 

 include "kys_DbConnect.php";

 $email = $username = $password = "";

if($_SERVER["REQUEST_METHOD"] == "POST"){

    $email = cleanData($_POST["email"]);
    $username = cleanData($_POST["username"]);
    $password = cleanData($_POST["password"]);        
}

$stmt = $con->prepare("SELECT * FROM kys_users WHERE username=? OR email=?");
$stmt->bind_param("ss",$username,$email);
$stmt->execute();
$stmt->bind_result($kys_id,$kys_email,$kys_username,$kys_password);
$stmt->fetch();

    if(isset($kys_username)){
         echo "Username or Email already exists";         
    }  
   else{

        $insert = $con->prepare("INSERT INTO kys_users (username, email, password) VALUES (?, ?, ?)"); 
        $insert->bind_param("sss",$username,$email,$password);
        $insert->execute();
         header("Location: http://localhost/KeyStroke/index.html");
        exit();

   }
function cleanData($data){

    $data = stripslashes($data);
    $data = htmlspecialchars($data);
    return $data;        
}
?>

我无法找出我的代码出了什么问题。

php
jquery
ajax
javascript
EN

回答 7

Stack Overflow用户

回答已采纳

发布于 2016-04-04 06:08:48

更新后的尝试如下：

代码语言：javascript
复制
<form role="form" action="kys_SignUp.php" method="post" id="kys_SignUp_form">
    <div class="form-group">
        <label for="email" >Email address:</label>
        <input type="email" style="width: 300px" class="form-control"  name="email" id="email" required>
    </div>

    <div class="form-group">
        <label for="Username" >Username:</label>
        <input type="text" style="width: 300px" class="form-control" name="username" id="Username" required>
    </div>

    <div class="form-group">
        <label for="password" >Password:</label>
        <input type="password" style="width: 300px" class="form-control" id="password" name="password" required>
    </div>

    <button id="submit_btn"  class="btn btn-default">Submit</button>

</form>

更新2：

代码语言：javascript
复制
<script>

      $(function() {
             // Handler for .ready() called.
             $("#submit_btn").on('click',function(event){
         //alert is not being called at all . That means .submit() is never beign called
               alert("hello there");
              event.preventDefault();

              var form = $('#kys_SignUp_form'); //changed from $(this)
              var url = form.attr('action');
              var email = $("#email").val();
              var username = $("#username").val();
              var password = $("#password").val();


                 $.ajax({
                      type: 'POST',
                      url: url,
                      dataType:"json", //<-- add this
                      data: { email: email, password: password, username: username },

                     success: function(data) {
                               if(data.success){
                            window.location.href=data.result;
                          }else {
                            alert("ERROR. "+data.result);
                             }

                             }

                 });

          });



    });
</script>

在PHP代码中

代码语言：javascript
复制
 <?php 

 include "kys_DbConnect.php";

 $email = $username = $password = "";

if($_SERVER["REQUEST_METHOD"] == "POST"){

    $email = cleanData($_POST["email"]);
    $username = cleanData($_POST["username"]);
    $password = cleanData($_POST["password"]);        
}

$stmt = $con->prepare("SELECT * FROM kys_users WHERE username=? OR email=?");
$stmt->bind_param("ss",$username,$email);
$stmt->execute();
$stmt->bind_result($kys_id,$kys_email,$kys_username,$kys_password);
$stmt->fetch();

    if(isset($kys_username)){
         echo json_encode(array("success"=>false,"result"=>"Username or Email already exists"));         
    }  
   else{

        $insert = $con->prepare("INSERT INTO kys_users (username, email, password) VALUES (?, ?, ?)"); 
        $insert->bind_param("sss",$username,$email,$password);
        $insert->execute();
        echo json_encode(array("success"=>true,"result"=>"http://localhost/KeyStroke/index.html"));

   }
function cleanData($data){

    $data = stripslashes($data);
    $data = htmlspecialchars($data);
    return $data;        
}
?>
票数 2
EN

Stack Overflow用户

发布于 2016-04-04 06:21:30

代码语言：javascript
复制
<script>

$("#clickbutton").click(function(){


var $url = 'kys_SignUp.php';
var $email = $("#email").val();
var $username = $("#Username").val();
var $password = $("#password").val();


$.ajax({
type: 'POST',
url: $url,
data: 'email='+$email+'&password='+$password+'&username='+$username,

success: function(data) {
alert("Transaction Completed!");

}

});

});
</script>

也可以删除表单中的操作并更改提交按钮。

代码语言：javascript
复制
<button type="button" id="clickbutton"  class="btn btn-default">Submit</button>
票数 1
EN

Stack Overflow用户

发布于 2016-04-04 06:43:57

尝试以下功能：

代码语言：javascript
复制
<script>

      $(function() {

             $('#kys_SignUp_form button[type="submit"]').on('click',function(event){

               alert("hello there");
              event.preventDefault();

              var form =  $("#kys_SignUp_form");//note here we select the form element to get the url
              var url = form.attr('action');
              var email = form.find("#email").val();
              var username = form.find("#username").val();
              var password = form.find("#password").val();


                 $.ajax({
                      type: 'POST',
                      url: url,
                      dataType:"json", 
                      data: { email: email, password: password, username: username },

                     success: function(data) {
                       if(data.message == "Success") {
                            window.location ='http://localhost/KeyStroke/index.html';
                       } else {alert(data.message)}

                 });

          });



    });
</script>

php：

代码语言：javascript
复制
 include "kys_DbConnect.php";
function cleanData($data){

    $data = stripslashes($data);
    $data = htmlspecialchars($data);
    return $data;        
}
function isUser($username,$email)
$stmt = $con->prepare("SELECT * FROM kys_users WHERE username=? OR email=?");
$stmt->bind_param("ss",$username,$email);
$stmt->execute();
$stmt->bind_result($kys_id,$kys_email,$kys_username,$kys_password);
$stmt->fetch();

    if(isset($kys_username)){
       return true;      
    }
}  
function inserNewUser($username,$email,$password)
        $insert = $con->prepare("INSERT INTO kys_users (username, email, password) VALUES (?, ?, ?)"); 
        $insert->bind_param($username,$email,$password);
        $insert->execute();

   }


if($_SERVER["REQUEST_METHOD"] == "POST"){
    $email = cleanData($_POST["email"]);
    $username = cleanData($_POST["username"]);
    $password = cleanData($_POST["password"]);  
    if (isUser($username,$email)) {
      echo json_encode(['message'=>'Username or Email already exists'])
    } else {
      inserNewUser($username,$email,$password);
      echo json_encode(['message'=>'Success']);
    }

} else {
echo json_encode(['message'=>'Error get method not allowed'])
}
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：

https://stackoverflow.com/questions/36395265

复制
相关文章

相似问题

领券

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

热门推荐

更多推荐

Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有 

深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

腾讯云计算（北京）有限责任公司 京ICP证150476号 |  京ICP备11018762号 | 京公网安备号11010802020287

问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档