2011-12-28 80 views
0

我正在使用HTML5驗證和jQuery的ajax和其他功能。我有一個表格,我已經添加驗證輸入類型,即<input id="country" type="search" value="" required />jQuery事件和HTML5驗證

現在的問題是,形式永遠不會發布,直到我已經填寫有效值,然後我需要做一個Ajax調用,而不是傳統的形式發佈。如果我添加一個事件這樣

<form id="objectForm" method="POST" action="#!/" onsubmit="return submitData();">它的工作原理 但像他這樣

$('.signinButton').unbind('click').click(function() { 
    submitData(); 
}); 

瀏覽器驗證不起作用。

有什麼建議可以在這裏完成。

感謝, WA

+1

事件處理程序的形式綁定submit事件不提交按鈕 – 2011-12-28 08:26:31

+0

確實控制到達內'$(「 signinButton」)的點擊。 ('click')。click(function(){}'? – 2011-12-28 08:27:22

+0

它用於$('#objectForm')。submit(function(){}); Thanks Phil – 2011-12-28 08:31:32

回答

1

正如評論所指出的,你要綁定到表單提交,而不是實際的按鈕點擊(如果他們打回車鍵會發生什麼,瀏覽器會自動提交表單?)。通常,每頁只能有一個表格標籤,因此您通常應該使用通用的$("form")選擇器以確保安全。但是,如果您確實有多個表單(或者只是想要格外小心),則可以通過表單的id選擇器來獲取它。

你指出你想要捕獲事件,而是使用Ajax調用(而不是允許回發),這種情況下,類似下面的例子可以很好地工作,關鍵是你必須停止表單元素的默認,以防止它做回發。

$(function() { 
    $("#objectForm").submit(function (e) { 
    if (validationPasses) { 
     callAjaxFunction(); 
    } 
    e.preventDefault(); 
    e.stopPropagation(); // this one isn't always necessary, but if you really want to make sure (like if you, for some reason, have nested form elements) that the event is stopped in its tracks, calling both helps. 
    }); 
});