將項目添加到jQuery中的表格

Question

我有一個輸入框，我用它將項目添加到數據庫中的表格。

它看起來像這樣：

<td> 
    <form class="insCat" action="#" name="insertCat"> 
    <input name="categorienaam" type="text"> 
    <input class="insert" type="submit" value="nieuwe categorie"> 
    </form> 
</td> 

而且我處理這件事像這樣的jQuery

jQuery(".insert").click(function(){ 

    str = jQuery("form.insCat").serialize(); 
    console.log(str); 

    jQuery.ajax({ 
    type: "POST", 
    data: str + "&cmd=insert", 
    url: "ajax_handler.php", 
    success: function(msg){} 
    }); 

    jQuery("div.result").empty(); 

}); 

但我不能看到我的日誌什麼，因爲頁面是每個插入後刷新。我不想要的。

有沒有辦法解決這個問題？

Answer 1

你需要阻止提交按鈕的默認事件：

jQuery(".insert").click(function(e){ 
      e.preventDefault(); 

      ...your code...  

      return false; 
    }); 

Answer 2

您在事件處理程序連接到提交按鈕，而不是停止違約事件的執行。所以JS運行，然後表單被正常提交。

首先，設置一個比「＃」（鏈接到頁面頂部的鏈接）更明智的操作，如果表單沒有JS提交。

接下來，將事件附加到窗體上，而不是按鈕。通過這種方式，如果通過其他方式提交（例如按下文本輸入上的回車鍵），它仍然可以工作。

jQuery("form.insCat").bind("submit", yourFunction); 

然後，編輯您的函數，以便它停止默認的事件操作。

var yourFunction = function(event){ 
    // do whatever you like then... 
    event.preventDefault(); 
};