Question

我一直很疯狂，我似乎无法想象如何在通过ajax提交表单时停止刷新页面。

我为你设置了一个jsfiddle：this link

我完成了event.prefentDefault（）并返回false;但似乎无法让它发挥作用。我只是傻了吗？

最终结果应该是，在提交表单时，表单区域应该消失并被“隐藏”的ajax_message替换，简单的内容为：“检查您的手机”。

提前感谢您保存我的发际线：）

Answer 1

您在{document ready>事件处理程序中定义了submit_number函数，并且只在该函数（范围）及其子函数内可见，因此您不能在HTML中使用它，其中只有全局范围是可用。

如果你有激活或类似的激活，你会在错误控制台中看到它。

快速黑客使其成功将取代

function submit_number(event) {

带

window.submit_number = function(event) {

因此明确地将您的函数放在全局范围内，但它是不推荐的方式。使用单一功能来污染全局范围毫无意义。

更好的方法是将您的函数注册为JS中的事件处理程序，如下所示：

$('form.kinkast_signup').submit(submit_number);

此外，您可能希望向该表单添加ID，并按ID而不是类名引用它。

Answer 2

不要在表单中使用“onclick”，而是将其绑定到JavaScript。

所以，而不是

function submit_number(event)

DO

$(form).submit(function(event)

Answer 3

<form method="post" class="kinkast_signup" onsubmit="submit_number(); return false">
<input id="login_email" type="text" name="to" />
<input id="signInButtonSubmit" type="submit" name="action" value="Send" />
</form>

然后

    window.submit_number=function() {
           //Prevent Default page refresh on submit
            //event.preventDefault();

......
}

可以删除preventDefault（）。

Answer 4

onclick事件发生时调用的函数应该只返回false。

Answer 5

试试这个http://jsfiddle.net/ntJux/6/

Answer 6

我修理了你的小提琴：

http://jsfiddle.net/ntJux/5/

我只是不引人注意地分配了事件处理程序，如：

$('#idOfTheForm').submit(function(event){
    ...
});

Answer 7

检查这些：

http://hasin.wordpress.com/2009/10/01/jqueryhooking-form-submit-and-making-it-an-ajax-request/

http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/

http://www.ryancoughlin.com/2008/11/04/use-jquery-to-submit-form/

Ajax提交页面刷新

7 个答案: