Question

更新

我正在使用jQuery 1.10.1 ...所以.live已被折旧......我刚刚更换了

$("table.dynatable button.remove").live('click', function (e) { 
$(this).parents("tr").remove();
});

与

$(document).on("click", "table.dynatable button.remove", function() { 
$(this).parents("tr").remove(); 
});

现在它有效，希望这有助于某人。

我有这个jQuery使用php和html表单：

我的php：

foreach ($matric_type as $row) {
$matric_type = $row->matric_type;
}

根据您拥有的matric（12级）认证类型填写下拉列表。每个matric cerification都有一个不同主题的列表，在另一个下拉列表中填充。

我的jQuery：

$(document).ready(function () {

    var id = 0;
    event.preventDefault();

    // Add button functionality
    $("table.dynatable button.add").click(function (e) {
        e.preventDefault();
        id++;
        var master = $(this).parents("table.dynatable");

        // Get a new row based on the prototype row
        var prot = master.find(".prototype").clone();
        prot.attr("class", "")
        prot.find(".id").attr("value", id);

        master.find("tbody").append(prot);
    });

    // Remove button functionality
    $("table.dynatable button.remove").live('click', function (e) { // this might be the problem?
        //e.preventDefault();           //this does not work
        // e.stopImmediatePropagation(); //this does not work
        // e.stopPropagation();          //this does not work
        $(this).parents("tr").remove();
        //$(this).closest('.prototype').remove()
        // $(this).parent().parent().remove();         
    });
});

HTML：

 <table class="dynatable">
                            <thead>
                                <tr>
                                    <th>Subject No</th>
                                    <th>Subject</th>
                                    <th>Mark</th>
                                    <th><button class="add">Add</button></th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr class="prototype">
                                    <td><input type="input" name="id[]" value="0" class="id" readonly /></td>
                                    <td><select id="list"></select></td>
                                    <td><input type="text" name="mark[]" value="" /></td>
                                    <td><button class="remove">Remove</button>
                                </tr>
                        </table>

这个jQuery使用添加按钮添加一个包含主题编号的行，一个包含主题的下拉列表，一个文本字段来输入该主题的标记。我可以添加正常..问题来自删除按钮..每次我单击删除按钮它刷新页面，并添加

？id％5B％5D = 0＆amp; mark％5B％5D =＆amp; id％5B％5D = 1＆amp; mark％5B％5D =

到网址。我添加的“主题”越多，上述时间越长，例如。如果我添加2个科目

？
ID％5B％5D = 0＆安培;马克％5B％5D =安培; ID％5B％5D = 1＆安培;马克％5B％5D =安培; ID％5B％5D = 2及标记％5B％5D =

我尝试添加删除功能：

e.preventDefault();           
e.stopImmediatePropagation(); 
e.stopPropagation();

但它仍然会重新加载页面，删除所有主题行而不是单击的行。有人可以帮我解决问题吗？

Answer 1

将type=button添加到按钮，否则按钮就像submit按钮

<button class="remove" type='button'>Remove</button>

如何停止jQuery .remove功能与.live刷新页面？

1 个答案: