在 jquery 中向表中添加项目答案

【问题标题】：Adding items to a table in jquery在 jquery 中向表中添加项目
【发布时间】：2009-07-17 10:29:57
【问题描述】：

我有一个输入框，用于将项目添加到数据库中的表中。

看起来像这样：

<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();

});

但我在日志中看不到任何内容，因为每次插入后页面都会刷新。这是我不想要的。

有没有办法解决这个问题？

【问题讨论】：

标签： php jquery forms

【解决方案1】：

需要防止提交按钮的默认事件：

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

            ...your code...    

            return false;
    });

【讨论】：

【解决方案2】：

您将事件处理程序附加到提交按钮，而不是停止执行默认事件。于是JS运行起来，然后表单就正常提交了。

首先，如果表单在没有 JS 的情况下提交，则设置一个比“#”（指向页面顶部的链接）更明智的操作。

接下来，将事件附加到表单，而不是按钮。这样，如果它通过其他方式提交（例如在文本输入上按下 enter 键），它仍然可以工作。

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

然后，编辑您的函数，使其停止默认事件操作。

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

【讨论】：