AJAX表单提交不阻止默认操作

时间:2022-11-23 17:28:24

I have made my own AJAX Login. but the script seems to redirect to the php page itself rather than submitting it through AJAX

我已经制作了自己的AJAX登录。但脚本似乎重定向到php页面本身而不是通过AJAX提交

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
        <script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
        <script type="text/javascript">
            var form = $('#loginform');
            form.submit(function (ev) {
            ev.preventDefault();
                $.ajax({
                    type: form.attr('method'),
                    url: form.attr('action'),
                    data: form.serialize(),
                    success: function (data) {
                        alert('ok');
                    }
                });        
             });
        </script>
    </head>
    <body>
        <form method="post" action="functions/fn_login.php" id="loginform">
            <input type="email" placeholder="Email / Mobile No." required name="email">
            <input type="password" placeholder="Password" required name="password">
            <input type="submit" id="submit" value="Submit">
        </form>
    <div id="user-result"></div>
    </body>
</html>

Anything wrong with my code?

我的代码出了什么问题?

2 个解决方案

#1


4  

You forgot to wait until the page is ready. Wrap your code with $(document).ready(function () { ... }); or $(function () { ... });:

你忘了等到页面准备好了。用$(document).ready(function(){...})包装你的代码;或$(function(){...});:

$(document).ready(function() {
  var form = $('#loginform');
  form.submit(function(ev) {
    ev.preventDefault();
    $.ajax({
      type: form.attr('method'),
      url: form.attr('action'),
      data: form.serialize(),
      success: function(data) {
        alert('ok');
      }
    });
  });
});

#2


0  

Try this instead.

试试这个。

 jQuery(function($){
      var frm = $('#loginform');
            frm.submit(function (ev) {
            ev.preventDefault();
                $.ajax({
                    type: form.attr('method'),
                    url: form.attr('action'),
                    data: form.serialize(),
                    success: function (data) {
                        alert('ok');
                    }
                });
                 return false;
       });
});

#1


4  

You forgot to wait until the page is ready. Wrap your code with $(document).ready(function () { ... }); or $(function () { ... });:

你忘了等到页面准备好了。用$(document).ready(function(){...})包装你的代码;或$(function(){...});:

$(document).ready(function() {
  var form = $('#loginform');
  form.submit(function(ev) {
    ev.preventDefault();
    $.ajax({
      type: form.attr('method'),
      url: form.attr('action'),
      data: form.serialize(),
      success: function(data) {
        alert('ok');
      }
    });
  });
});

#2


0  

Try this instead.

试试这个。

 jQuery(function($){
      var frm = $('#loginform');
            frm.submit(function (ev) {
            ev.preventDefault();
                $.ajax({
                    type: form.attr('method'),
                    url: form.attr('action'),
                    data: form.serialize(),
                    success: function (data) {
                        alert('ok');
                    }
                });
                 return false;
       });
});