$ .each with(live,bind,delegate)jQuery

时间:2011-10-25 07:07:15

标签: jquery

有人可以帮我解决这段代码:

var rows = $(".delete"); //rows to delete
var irows = $(".insert");//rows to insert
//delete row
$.each(rows, function(i ,v) {
    $(v).click(function() {
        $(this).closest("tr").fadeOut(300, function() { $(this).remove(); });               
    });
});

//insert row before
$.each(irows, function(i, v) {
    $(v).click(function() {
        var irowIndex = $(this).closest("tr").index();
        var newRow = "<tr class=\"dataRow\">" + "
                    "<td><input type=\"button\" value=\"&#8597\" class=\"drag\" /><input type=\"button\" value=\"&#187;\" class=\"insert\" /><input type=\"button\" value=\"x\" class=\"delete\" /></td><td><input type='hidden' name='records_id[]' /><input style=\"text-align: center\" type='text' class='itemno' name='existing_itemno[]' size='5' /></td>" +
                    "<td>&nbsp;</td>" +
                    "<td>&nbsp;</td>" +
                    "<td>&nbsp;</td></tr>";
        $("#tbox tr:eq(" + irowIndex + ")").before(newRow);
    });
});

<table id="#tbox">
    <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
</table>

添加和删除行有效,但添加的行中触发删除/插入的按钮不起作用。我的意思是如果你添加一行,然后单击该行上的删除按钮,它将无法正常工作。我已经在网上搜索了,我找到了bind()live()delegate。问题是如何在.each内使用它。还是有比这更好的方法?请帮忙。

1 个答案:

答案 0 :(得分:2)

你可以摆脱你的each并做类似的事情 -

$('.delete').live('click',function() {
   $(this).closest("tr").fadeOut(300, function() { $(this).remove(); }); 
})

这应该将点击处理程序添加到页面上的所有.delete按钮,包括动态生成的按钮。