newajax onclick不适用于动态创建的项目

时间:2015-05-02 21:20:18

标签: javascript php ajax

我有一个表,用户可以使用jquery添加行。这一切都很好。我遇到的问题是动态创建的行有一个带有onclick事件的按钮,该事件连接到新的Ajax代码以从计算机浏览。问题是按钮在第一个生成的行中工作但是当我生成另一个按钮时不起作用。

这是带有onclick事件的按钮:

<a  onclick="image_upload('image<?php echo $image_row; ?>', 'thumb<?php echo $image_row; ?>');" id="simple-image<?php echo $image_row; ?>" class="upimage"><?php echo $text_browse; ?></a>

事件的新Ajax代码:

  function  image_upload(field, thumb ){
    new AjaxUpload('#simple-image' + <?php echo $image_row; ?>, {
    action: 'index.php?route=common/filemanager/upload&image=' + encodeURIComponent($('#' + field).attr('value')),
    name: 'image',
    autoSubmit: true,
    responseType: 'json',

    onChange: function(file, extension) {

        this.setData({'directory': ''});
     this.submit();
    },

    onSubmit: function(file, extension) {
        $('#simple-image' + <?php echo $image_row; ?>).append('<img src="catalog/view/theme/default/image/loading.gif" class="loading" style="padding-left: 5px;" />');
    },
    onComplete: function(file, json) {
        if (json.success) {
         $('#' + field).attr('value','data/user/'+file);
            $.ajax({
                    url: 'index.php?route=common/filemanager/image&image=' + encodeURIComponent($('#' + field).attr('value')),
                dataType: 'text',
                success: function(text) {
                $('#' + thumb).replaceWith('<img src="' + text + '" alt="" id="' + thumb + '" />');                          
                }
            });
        }

        if (json.error) {
            alert(json.error);
        }

        $('.loading').remove(); 
    }
     });

        };  

非常感谢任何帮助。

1 个答案:

答案 0 :(得分:0)

<?php $iid = 0; ?>

<a  onclick="image_upload('image<?php echo $image_row; ?>', 'thumb<?php echo $image_row; ?>','simple-image<?php echo $image_row.$iid; ?>');" id="simple-image<?php echo $image_row.$iid++; ?>" class="upimage"><?php echo $text_browse; ?></a>


function  image_upload(field, thumb , idd ){
new AjaxUpload('#'+idd , {
action: 'index.php?route=common/filemanager/upload&image=' + encodeURIComponent($('#' + field).attr('value')),
name: 'image',
autoSubmit: true,
responseType: 'json',

onChange: function(file, extension) {

    this.setData({'directory': ''});
 this.submit();
},

onSubmit: function(file, extension) {
    $('#simple-image' + <?php echo $image_row; ?>).append('<img src="catalog/view/theme/default/image/loading.gif" class="loading" style="padding-left: 5px;" />');
},
onComplete: function(file, json) {
    if (json.success) {
     $('#' + field).attr('value','data/user/'+file);
        $.ajax({
                url: 'index.php?route=common/filemanager/image&image=' + encodeURIComponent($('#' + field).attr('value')),
            dataType: 'text',
            success: function(text) {
            $('#' + thumb).replaceWith('<img src="' + text + '" alt="" id="' + thumb + '" />');                          
            }
        });
    }

    if (json.error) {
        alert(json.error);
    }

    $('.loading').remove(); 
}
 });

    };