javascript - jQuery $ .ajax无法正常工作。表格发布

我想使用jquery将表单数据发送到服务器，
我跟随这个页面↓

how do i submit a form using get method in jquery。

但是不起作用，没有任何窗口警报。
我不知道为什么。

我已经在头（版本1.11.3）中导入了jquery脚本。

<script src="./static/jquery-1.11.3.js" type="text/javascript"></script>

这是我的剧本。

<script>
    function test(){
            document.getElementById("form_test").submit( function() {
                $.ajax({
                    url     : $(this).attr('action'),
                    type    : $(this).attr('method'),
                    data    : $(this).serialize(),
                    success : function( response ) {
                        alert( response );
                    },
                    error:function(){
                        alert("error");
                    }
                });
                return false;
            });
        }
</script>

这是我的表单代码。

<form id="form_test" class="appnitro"  method="post" action="">
    <div class="form_description">
        <p>test.</p>
    </div>
    <ul >
        <li id="li_1" >
            <label class="description" for="info">info</label>
            <div>
                <input id="info" name="info" class="setInfo" type="text" maxlength="16" value=""/>
                <label id="infoMsg" class="Message"></label><br/>
            </div>
        </li>
        <li class="buttons">
            <button type="button" class="mbutton" onclick="test()">submit</button>
        </li>
    </ul>
</form>

最佳答案

从test()删除提交处理程序

document.getElementById("form_test").submit(function () {

这不是必需的，因为当用户单击按钮时将调用功能test。

function test() {
    var $form = $('#form_test');
    $.ajax({
        url: $form.attr('action'),
        type: $form.attr('method'),
        data: $form.serialize(),
        success: function (response) {
            alert(response);
        },
        error: function () {
            alert("error");
        }
    });
    return false;
}

我还建议您使用jQuery on()绑定事件

$('#form_test').on('submit', function () {
    $.ajax({
        url: $(this).attr('action'),
        type: $(this).attr('method'),
        data: $(this).serialize(),
        success: function (response) {
            alert(response);
        },
        error: function () {
            alert("error");
        }
    });
    return false;
});