jQuery提交不起作用答案

【问题标题】：jquery submit not workingjQuery提交不起作用
【发布时间】：2011-08-11 01:09:10
【问题描述】：

我无法正确提交此表单。如果我的按钮类型为“提交”，它总是提交，如果我使用“按钮”作为它从不提交的类型，则 ajax 调用会带来正确的值，所以即使 if 语句遵循正确的路径，但它好像没关系。

<script type="text/javascript">
$(document).ready(function(){
 $("#submitButton").click(function(e) {
        var un  = $('#username').val();
        $('#mike').html("");       
            $.ajax(
            {              
                type: "POST",
                url: "Utilities/CheckUsername.php",
                data: "un="+ un,
                success: function(data2)
                {                  
                   if(data2=="Username Does Not Exist")
                    {         
                       $("#login2").submit();                   
                    }
                    else
                    {
                        $('#mike').html(data2);
                        return false;                      
                    }                   
                }

            });
             });

             }); 
             </script>
</head>
<body>
      <form name="login" id="login2" method="post" action="dsds.html">
        UserName<input type="text" name="username" id="username"value="">
        <br/>
        Password<input type="text" name="password" id="password" value="">
        <br/>
        Password Again<input type="text" name="passwordagain" id="passwordagain" value="">
        <br/>
        <input type="hidden" name="NewClass" id="NewClass" value="true">
        <br/>
        <input type="submit" name="no" id="submitButton" value="submit">
     </form>
     <span id = "mike"></span>
</body>
</html>

编辑：我在这里添加了 return false 并且它有效，但是为什么呢？我只是从点击事件中返回 false

else
            {
                $('#mike').html(data2);

            }                   
        }

    });
     return false;
     });

【问题讨论】：

标签： jquery submit

【解决方案1】：

您只需要从您的提交事件处理程序中return false。直到异步 ajax 调用完成后，您在其中的 return false 才会执行。

您也可以使用 e.preventDefault() 来做同样的事情。

这两种方法都只是防止发生默认行为，即提交表单。

【讨论】：

解决了我的问题。抱怨是 $.post(..) 文件未定义。

【解决方案2】：

我建议你将事件处理程序绑定到表单的submit 事件：

$('#login2').submit(function(event) {
    event.preventDefault();
    //...
});

您必须阻止事件的默认操作，即提交表单。这是通过event.preventDefault ^[docs] 完成的。 Ajax 回调中的return false 将不起作用，因为事件处理程序在收到响应之前返回。

如果你这样做，你必须设置某种标志来查看你处于进程的哪个状态：

var nameAvailable = false;

$('#login2').submit(function(event) {
    if(!nameAvailable) {
        event.preventDefault(); // don't submit form
        //...
        $.ajax({
            success: function() {
                // if name available
                nameAvailable = true;
                $('#login2').submit();
            }
        });
     }
});

【讨论】：