Question

我认为这会奏效，也许我错过了什么？如何调用javascript提交活动？

谢谢，

约翰

<html>
<body>
<form name='myForm' action='formprocess.php' method='get'>
Name: <input type='text' onChange="ajaxFunction();" name='username' /> <br />
Time: <input type='text' name='time' />
</form>
<script type="text/javascript">
    var frm = $('myform');
    frm.submit(function () {
        $.ajax({
            type: frm.attr('method'),
            url: frm.attr('action'),
            data: frm.serialize(),
            success: function (data) {
                alert('ok');
            }
        });

        return preventDefault();
    });
</script>
<div id="box"> </div>
</body>

Answer 1

第一个问题是name='myForm'。 name属性（表单 controls 除外（如<input>））已过时。请改用id属性。

id="myForm"

第二个问题是$('myform');会选择<myform>元素。使用#myForm按ID选择元素。

第三个问题是return preventDefault();。

preventDefault是事件对象的方法，不是全局的，不应该返回。

您需要捕获事件对象（它是函数的第一个参数）并在其上调用方法：

frm.submit(function (evt) {
    …
    evt.preventDefault();
});

第四个（给Tieson T.提示），您需要在表单中提交一个提交按钮。

Answer 2

.submit()不提交表单，而是向onsubmit事件添加事件处理程序。你仍然需要一个提交按钮。这是未经测试但应该有效：

<form id="myForm" action='formprocess.php' method='get'>
    Name: <input type='text' onChange="ajaxFunction();" name='username' /> <br />
    Time: <input type='text' name='time' />
    <button type="submit">Send</button>
</form>
<script>
    $(function(){
        $('#myform').on('submit', function (e) {

            e.preventDefault();

            $.get(
                $(this).attr('action'),
                $(this).serialize(),
                function (response, status, jqxhr) {
                    alert('ok');
                }
            });

        });
    });
</script>

如何将ajax提交功能添加到表单中

2 个答案: