0

所以我正在构建一个图像上传器......

我需要能够单击列表中的任何 div 并让它们消失。简单的？是的。

但我也可能在该列表中有 div 是在页面加载后动态生成的。

我有 ajax 处理图像并上传它等等，上传后它.append()是一个 div 保存新上传的图像。

这是我的 AJAX 代码：

$("#chosenfile").change(function(){
    var data;

    data = new FormData();
    data.append('uploadedfile', $( '#chosenfile' )[0].files[0]);
    $('#loader').css('display','block');
    $.ajax({
        url: '/includes/uploadimage.php',
        data: data,
        processData: false,
        contentType: false,
        type: 'POST',
        success: function ( data ) {
            //console.log(data); //returns a string of the data.
            var json = JSON.parse(data); //parses the string into an object.
            //console.log(json); //logs the object.

            if (json.link) { //If the image is uploaded and returned a link.
                $('#remove').click();
                $('#scrollwindow').append("<div class='you'><img imgid='" + json.id + "' src='" + json.link + "' alt=''><span class='delete'>x</span></div>");
                addToSlider(1);
                $(".delete").click(deleteRowFunct);
                $('#loader').css('display','none');
            };
        }
    });
});

$(".delete").click(function(){
    deleteRowFunct;
        addToSlider(-1);
});

这允许用户删除一行。当这个函数被触发时，它将删除数据库中的行（当前它试图删除该行两次，因为 .click() 事件和函数是在两个地方定义的。）这没什么大不了的......我意思是它基于行ID，所以我不在乎它是否尝试删除它两次..

但是现在我不仅需要删除数据库中的行，我还需要调整包含包含图像的 div 列表的 div 的大小......这就是我的代码停止工作的地方......

我addToSlider(1);每次上传图像时都会使用它来查找图像的大小并相应地调整包装 div 的大小。

这很好用...

现在我想在addToSlider(-1);删除行时找到图像的大小并相应地调整包装 div。

我试过的：

如果我将 ajax 添加addToSlider(-1);到 ajax if(data.link)，它只会在图片上传后调整大小。

如果我在代码末尾添加addToSlider(-1);事件$(".delete").click()，它只会在页面加载时已经存在的图像上调整大小，而不是动态上传的图像。

^^ 上面显示在代码中。

如果我添加addToSlider(-1);到实际deleteRowFunct()大小减去两次...

问题：

如何调用“deleteRowFunct()”并且addToSlider(-1);仅调用一次并将.click()事件应用于动态生成的 div 和页面加载时生成的 div？

4

2 回答 2

1

你可以使用 on jquery

$(document).on('click', '.delete', function(){
 deleteRowFunction(this);
});

这会将事件添加到动态生成的元素中。

编辑：让您的 deleteRowFunction 接受一个参数并将其传递给它。这样你的函数就可以使用它。

function deleteRowFunction(thing){
 $(thing).doSomething();
}
于 2013-05-11T19:26:22.420 回答
0

尝试使用此方法：

$(".delete").live('click', function(e){
  // do stuffs
});

http://api.jquery.com/live/

于 2013-05-11T19:41:17.630 回答