我怎樣才能停止jQuery的事件傳播

我正在提交一個jQuery的表單，似乎無法阻止表單提交後重新加載頁面。我怎樣才能停止jQuery的事件傳播

我當前的代碼如下所示：

HTML：

<form class="form-horizontal" method="post" action="#" name="basic_validate" id="basic_validate" /> 
    <div class="control-group"> 
    <label class="control-label">Image Path</label> 
    <div class="controls"> 
     <input type="text" name="imagepath" id=imagepath /> 
    </div> 
    </div> 
    <div class="form-actions"> 
    <input type=button value="Send" id="sendemailbtn" class="btn btn-primary" /> 
    </div> 
</form>

的jQuery：

$("#sendemailbtn").click(function(e) { 
    e.preventDefault(); 
    $("#basic_validate").submit(); 

    if ($("#basic_validate").children('.control-group').hasClass('error')) { 
     return false; 
    } else { 
     $.post('send_email.php', $("#basic_validate").serialize(), function(data) { 

      // I see output on the server side but never hit this area after the submission, 

      console.log(data); 
     }, "json"); 
    } 
});

來源

2013-03-15 user1216398

$("#basic_validate").submit();

是您的罪魁禍首。該行提交表單並使頁面重新加載。

來源

2013-03-15 13:00:08 Alasjo

反正是有防止頁面加載？ – user1216398 2013-03-15 13:05:51

如果您省略該行（刪除/註釋掉）並讓腳本繼續。試試看。 – Alasjo 2013-03-15 13:07:16

這將無法正常工作，因爲我在表單submisison上做了一些表單驗證 – user1216398 2013-03-15 13:10:10

按照submit doc，

[...]我們可以通過調用事件對象.preventDefault（）或者從我們的處理程序返回false取消提交操作。

由於.preventDefault()似乎並不爲你工作，嘗試：

$("#basic_validate").submit(function(){ 

    if ($("#basic_validate").children('.control-group').hasClass('error')) { 
     return false; 
    } 
    else { 
     $.post('send_email.php', $("#basic_validate").serialize(), function(data) { 

     // I see output on the server side but never hit this area after the submission, 

      console.log(data); 
     }, "json");        
    }    
    return false; //This prevents reloading 
});

來源

2013-03-15 13:00:15 Bigood

這是因爲.submit()這樣工作。如果你想用AJAX提交表單，那麼你要手動進行AJAX請求與$.post無.submit()：

$("#sendemailbtn").click(function (e) { 
    e.preventDefault(); 
    if (!$("#basic_validate").children('.control-group').hasClass('error')) { 
     $.post('send_email.php', $("#basic_validate").serialize(), 
     function(data) { 
      console.log(data); 
     }, "json");        
    }  
});

來源

2013-03-15 13:00:16 Jon

我怎樣才能停止jQuery的事件傳播

回答

相關問題