Question

我在HTML中有以下表格

<form id="test" name="test">
<button id="save" class="small"><i class="icon-plus"></i>save</button>  //KickStart
<button id="edit" class="small"><i class="icon-plus"></i>edit</button>
 <input value=1 type="text" name=Col1 class="Hide">
 <input value=2 type="text" name=Col2 class="Hide">

</form>

点击按钮时调用的JQuery函数

$(document).on("click", "#edit", function (e) {

    return false;
});

但是当我点击编辑按钮表单提交而不按预期调用Jquery函数时。

也许我错过了表格的某些属性？

Answer 1

在将事件绑定到任何元素之前，您必须等待DOM准备好。

你要做的就是将你的代码放在

中

$(document).ready(function(){
    $(document).on("click", "#edit", function (e) {
        return false;
    });
});

Answer 2

如果标题中包含以下代码，则需要使用$(function(){}).这将在加载页面后运行代码。

$(function(){
  $("#edit").click(function (e) {
    alert("a");
    return false;
  });
});

Answer 3

试试这个，

$(document).ready(function(){
     $("#edit").click(function(e) {
         alert("edit button clicked!");
         return false;
     });
});

Answer 4

另一个解决方案是使用preventDefault（）函数：

$(document).on("click", "#edit", function (e) {
    alert("Hi");
    e.preventDefault();
});

请参阅http://jsfiddle.net/AbP8Z/和http://api.jquery.com/event.preventDefault

带有多个按钮的HTML表单 - 不调用Jquery函数

4 个答案: