Question

好像我无法序列化我的表单。我确实得到了lol的第一个警报，但没有获得pdata的第二个警报。有谁看到什么错了？我试图使用ajax发送表单中的数据。下面是脚本和html代码。

<html>
<head>

    <script>
        function dologin(event) {
            event.preventDefault();

            alert("lol");
            var pdata = $('#form').serialize();
            alert(pdata);

            $.ajax({
                type: 'POST',
                data: pdata,
                url: 'LINK',
                success: function(data) {
                    //console.log(data);
                    alert("YAY");
                },
                error: function() {
                    //console.log(data);
                    alert("NAY");
                } 
            });
        };
    </script>
</head>
<body>
<h1>Logg inn</h1>
    <form id="form" onsubmit="dologin()">
    <div class="form-group">
        <label for="email">Epost</label>
        <input type="email" class="form-control" name="login" value="" placeholder="Epost">
    </div>
    <div class="form-group">    
        <label for="password">Passord</label>
        <input type="password" class="form-control" name="password" value="" placeholder="Passord">
    </div>
    <div class="checkbox">
        <label>
        <input type="checkbox" name="remember_me">
        Husk meg
        </label>
    </div>
        <button type="submit" class="btn btn-default">Logg inn</button>
    </form>

    <div class="login-help">
      <p>Glemt passordet? <a href="index.html">Trykk her for å endre det</a>.</p>
    </div>
</body>
</html>

Answer 1

您的代码存在的问题是，您正在访问事件参数，因为没有参数传递给该函数，因此它会触发错误并将表单作为普通表单提交提交。

如果你想保留你的实现，你可以像下面那样修改你的代码：

function dologin() {

    alert("lol");
    var pdata = $('#form').serialize();
    alert(pdata);

    $.ajax({
        type: 'POST',
        data: pdata,
        url: 'LINK',
        success: function(data) {
            //console.log(data);
            alert("YAY");
        },
        error: function() {
            //console.log(data);
            alert("NAY");
        }
    });

   return false;
};

并修改此行

<form id="form" onsubmit="dologin()">

到

<form id="form" onsubmit="return dologin()">

或者可以使用以下方式

$(document).ready(function() {
    $('#form').submit(function(e){
        e.preventDefault();
        $.ajax({
            type: 'POST',
            data: $(this).serialize(),
            url: 'LINK',
            success: function(data) {
                //console.log(data);
                alert("YAY");
            },
            error: function() {
                //console.log(data);
                alert("NAY");
            }
        });
    });
});

表格标签应该是：

<form id="form">

Ajax将表单发送到服务器，序列化失败？

1 个答案: