为什么 jQuery/AJAX 按钮不起作用答案

【问题标题】：why jQuery/AJAX button don't working为什么 jQuery/AJAX 按钮不起作用
【发布时间】：2017-09-18 06:59:29
【问题描述】：

我有一个通过 jQuery AJAX 请求提交的登录表单。我想用“按钮”可以提交表单。但是只有“按钮”对功能（数据）没有响应

HTML：

<form action="" method="post" class="form-signin">
    <input type="text" placeholder="Username" id="user" class="form-control loginid">
    <input type="text" placeholder="Password" id="password" class="form-control loginpw">
    <input type="text" placeholder="Check" id="check" class="form-control ck_secure">
    <div class="captcha_block">
      <span id="captcha" class="captcha"></span>
      <a href="#" class="change" onclick="captchaCode()"> <img src="img/change.svg" alt="" class="photo04"></a>
    </div>
    <!-- <a href="#" class="login" id="login">Sign In</a> -->
    <!-- <input id="login" type="button" class="btn btn-lg btn-primary btn-block" value="Sign In"> -->
    <button id="login" class="btn btn-lg btn-primary btn-block" name="login">Sign In</button>

javascript:

$("#login").click(function(){
        if($('#code').text() != $('#check').val()){
          alert('error');
          location.reload();
        }
        else{
          $.post('./process.php',
            {
              type : 'login',
              user : $('#user').val(),
              Passwd: $('#password').val()
            },
            function(data){
              alert(data);
              window.location.href = '../';
          });
        }
      });

process.php：

if($_POST['type'] == 'login'){
  $login_row = @mysql_fetch_assoc(@mysql_query("SELECT * FROM `person` WHERE `user` = '".$_POST['user']."' AND `password` = '".$_POST['Passwd']."'"));
  if($login_row)
  {
   $_SESSION['user'] = $login_row['user_name'];
   echo 'welcome';
  }else
  {
   echo 'Incorrect username/password. please login again';
  }
 }

【问题讨论】：

如果你使用 ajax 而不是不需要表单
@W.rc 你在控制台有什么错误吗？
您是否将click 事件处理程序放在document.ready 中？如果 then 也不起作用，您应该尝试事件委托。
您是否关闭了表单？ “#code”在哪里？
请停止使用：@mysql_fetch_assoc 和@mysql_query，php 中的@ 符号代表“忽略此行的错误”，使用起来非常糟糕。使用 PDO 或 mysqli 来避免 mysql 出现不推荐使用的错误

标签： php jquery html ajax

【解决方案1】：

在您的登录按钮中添加属性type=button，如下所示。

<button type="button" id="login" class="btn btn-lg btn-primary btn-block" name="login">Sign In</button>

【讨论】：