jquery提交不会阻止提交表单

时间:2011-12-03 23:27:44

标签: javascript jquery

我有以下html表单

<form action="/newPost" id="submit_new" method="get"><div class="iwill">
    <div class="iwill-holder">
        <div class="txt"></div><div class="f"><input class="text" id="quickpost" name="quickpost" type="text" value=""></div>
        <div class="img regularProgress" alt="Processing..."><input alt="Continue" class="iwill-btn movable" id="continue_submit" src="<?=$config['http']?>images/btn-2-continue-gray.png" type="image"></div>
    </div>
</div>
</form>

这里是jquery函数:

$('#submit_new').submit(function() {

var error = 0;

    var quickpost = $("#quickpost").val();
    if( quickpost == '' ) {
    $("#quickpost").effect("shake", { times:3 }, 50);
    $('#quickpost').css("color","red");
    $('#quickpost').css("border","red 1px solid");
    error = 1;

    }else{
      $('#quickpost').css("border","gray 1px solid");
      $('#quickpost').css("color","black");
      error = 0;
    }


    if(errorCounter > 0){
      return false;
    }else{

        $.ajax({
                  url: 'sendPost.php?quickpost='+quickpost,
                  success: function(data) {
                    $('#result').prepend(data).slideDown('slow', function() {});

                  }
                });
    }
    return false;
});

从技术上讲,我试图使用ajax发布表单值,但无论我做什么,表单仍然会提交到操作页面。我试图让所有路径都导致false,但它不起作用

4 个答案:

答案 0 :(得分:2)

尝试阻止默认行为

$('#submit_new').click(function(e) {
e.preventDefault();
...

你也有拼写错误

if(errorCounter > 0){
    return false;
}else{

应该是:

if(error > 0){
    return false;
}else{

答案 1 :(得分:1)

$('#submit_new').submit(function(e) {
   e.preventDefault();
   //other stuff
});

你需要在submit函数中使用preventDefault()。

答案 2 :(得分:1)

我的版本仍然使用return false来阻止表单提交 http://jsfiddle.net/pKR6G/2/

注意:我已经注释掉了摇晃效果,所以我不需要包含jQueryUI。

答案 3 :(得分:0)

事件侦听器方法不关心从侦听器函数返回的内容。您需要对传入的事件对象使用jquery preventdefault方法。