Question

长时间读者 - 第一次发布海报。

我有这个JQuery函数，我正试图从另一个JQuery函数执行它：

$(".delete_item").click(function() {
    var element = $(this);
    var Id = element.attr("id");
    var split = Id.split('_');
    var row = 'row_' + split[1];

    var dataString = 'item=' + split[1];

    $.ajax({
        type: "POST",
        url: "_remove.jsp",
        data: dataString,
        success: function() {

           removeRow(row);

        }

    });

我遇到的问题是当我在成功时使用prepend：另一个函数的function（），试图调用这个函数。它不起作用：

$("#table")
    .prepend($('<tr>')
        .prepend($('<td>')
            .prepend($('<form>')
                .attr('method','post')
                .attr('id','delete_1234')
                .attr('name','delete_1234')
                .prepend($('<input>')
                    .attr('type', 'image')
                    .attr('name','Delete')
                    .attr('src', 'images/button_delete.gif')
                    .attr('class','delete_item')
                    .attr('id','delete_1234')
                )
            )
        )

我试图从成功函数中调用的函数（第一个）在从html页面使用时工作正常，但在从prepend调用时却没有。它不是调用'delete_item'类函数，而是重新加载页面。希望我让自己变得可以理解，并且有人知道如何解决这个问题。

由于

Answer 1

所以你的意思是当你以编程方式创建input[type="image"]时，单击它时不会执行“click”事件处理程序？

这是因为您将click事件与

绑定在一起

$(".delete_item").click(function() {...}`

该元素可能尚不存在，因此没有事件绑定到它。

您应该将事件委派与.on()（或.delegate()）：

一起使用

$('#table').on('click', '.delete_item', function(e) {
    ...
});

上面的代码是做什么的？

将事件处理委托给ID为#table的元素（基本上是现有的父元素）。
捕获单击事件时，如果目标是具有类.delete_item的元素，请执行处理程序。

我邀请您阅读.on()以获取有关事件委派及其工作原理的更多信息和示例

JQuery函数：prepend <form>调用另一个JQuery函数</form>

1 个答案: