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

在jquery中向表中添加项

2 个答案: