event.preventDefault 似乎不起作用答案

【问题标题】：event.preventDefault doesn't seem to workevent.preventDefault 似乎不起作用
【发布时间】：2014-10-15 11:35:04
【问题描述】：

所以我试图阻止表单刷新页面，这是我正在使用的代码：

$("#getName").submit(function(refresh) {
    refresh.preventDefault();
    $("#p22").fadeOut(50);
    $("#p23").fadeIn(800);
    document.getElementById("p23").innerHTML = "Oh " + userName + ", alright i wont forget that!";

})

我似乎无法正常工作....

id = getName - 是表单id

【问题讨论】：

控制台中的任何错误
控制台说什么？并且可以缩短回调的第四行：$('#p23').html("Oh " + userName + ", alright i wont forget that!")
userName 没有在上面的代码中定义。你能展示剩下的代码吗？
提供简约的 JSFiddle 示例来重构您的问题。

标签： javascript jquery forms preventdefault

【解决方案1】：

您的问题类似于：https://stackoverflow.com/a/6462306/986160

试试这个：

$("#getName").submit(function(refresh) {
    $("#p22").fadeOut(50);
    $("#p23").fadeIn(800);
    $("#p23").html("Oh " + userName + ", alright i wont forget that!");
    return false;
})

通过返回 false 就像一起 refresh.preventDefault() 和 refresh.stopPropagation() ;) 在此处查看详细信息：https://stackoverflow.com/a/1357151/986160

【讨论】：

【解决方案2】：

我得到了这个 jQuery 文档的示例代码，它似乎工作正常（它会发出警报，但没有链接到 destination.html。在你的代码中一切似乎都很好，它可能是你正在寻找的不同的东西。

http://api.jquery.com/submit/

$( "#target" ).submit(function( event ) {
  alert( "Handler for .submit() called." );
  event.preventDefault();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<form id="target" action="destination.html">
  <input type="text" value="Hello there">
  <input type="submit" value="Go">
</form>
<div id="other">
  Trigger the handler
</div>

【讨论】：

为您编辑。 @laffuste

【解决方案3】：

返回 false 不会验证您的表单并且您的页面不会被刷新。

$("#getName").submit(function(refresh) {
    refresh.preventDefault();
    $("#p22").fadeOut(50);
    $("#p23").fadeIn(800);
    document.getElementById("p23").innerHTML = "Oh " + userName + ", alright i wont forget that!";
    return false;
})

【讨论】：

返回假；就像 refresh.preventDefault();和 refresh.stopPropagation();所以你不需要顶部的 refresh.preventDefault() 。检查这个：stackoverflow.com/a/1357151/986160