javascript - jQuery 图像删除确认消息

Question

我想知道是否有人可以帮助我。

首先，我真诚地道歉，因为我不太熟悉 JavaScript，有些人可能觉得这是一个愚蠢的帖子，但任何帮助将不胜感激。

我目前正在使用下面的脚本来删除图库图像。

<script type="text/javascript"> 
        Galleria.ready(function() {
            this.$('thumblink').click();

        $(".galleria-image").append( 
        "<span class='btn-delete ui-icon ui-icon-trash'></span>"); 
        $(".btn-delete").live("click", function(){  
        var img = $(this).closest(".galleria-image").find("img"); 
        $.msgbox("You are about to delete this image. It cannot be restored at a later date. Do you wish to continue?", {
        type: "alert",
          buttons : [
            {type: "submit", value: "Delete"},
            {type: "cancel", value: "Cancel"}
          ]
          },
          function(result) {
          if(result)


          // send the AJAX request
          $.ajax({
            url : 'delete.php',
            type : 'post',
            data : { image : img.attr('src'),  idnum: "VALUE", lid: "VALUE"},
            success : function(){
            img.parent().fadeOut('slow');
            }
        });               
    });
        return false;
    });     
});

</script>

我现在找到了更合适的jQuery确认脚本here我现在想尝试并实现它。

使用此站点中的 script.js 文件和我现有的脚本，我尝试将它们组合起来并得出以下结果:

<script type="text/javascript"> 
Galleria.ready(function() {
    this.$('thumblink').click();
    $(".galleria-image").append( 
    "<span class='btn-delete ui-icon ui-icon-trash'></span>"); 
    $('.btn-delete').click(function(){
    var elem = $(this).closest(".galleria-image").find('.item'); 
        $.confirm({
            'title'     : 'Delete Confirmation',
            'message'   : 'You are about to delete this item. <br />It cannot be restored at a later time! Continue?',
            'buttons'   : {
                'Yes'   : {
                    'class' : 'blue',
                    'action': function(){
                        elem.slideUp();
                              $.ajax({
                                url : 'delete.php',
                                type : 'post',
                                data : { image : img.attr('src'),  idnum: "VALUE", lid: "VALUE"},
                                success : function(){
                                img.parent().fadeOut('slow');
                                }
                            }); 

                    }
                },
                'No'    : {
                    'class' : 'gray',
                    'action': function(){}  // Nothing to do in this case. You can as well omit the action property.
                }
                }
                }
            }
        });

    });

});
</script>

我遇到的问题是，虽然页面加载了，但它不会以默认的Gallery图像格式加载，并且我使用的垃圾桶图标删除图像的视觉触发器已消失在每个图像的底部。

我进入了 JavaScript 控制台，它显示的错误是:Uncaught SyntaxError: Unexpected token }在我的代码中突出显示这一行作为问题:$.confirm({ 但我必须诚实地说我不太确定这意味着什么。

我尝试了很多改变代码的变体来尝试让它工作，不幸的是没有成功。

我只是想知道是否有人可以看一下这个，并就我出错的地方提供一些指导。

非常感谢和亲切的问候

工作解决方案

<script type="text/javascript"> 
Galleria.ready(function() {
this.$('thumblink').click();
$(".galleria-image").append( 
"<span class='btn-delete ui-icon ui-icon-trash'></span>"); 
$('.btn-delete').click(function(){
var img = $(this).closest(".galleria-image").find('img'); 
    $.confirm({
        'title'     : 'Delete Confirmation',
        'message'   : 'You are about to delete this item. <br />It cannot be restored at a later time! Continue?',
        'buttons'   : {
            'Yes'   : {
                'class' : 'blue',
                'action': function(){
                    //elem.slideUp();
                          $.ajax({
                            url : 'delete.php',
                            type : 'post',
                            data : { image : img.attr('src'),  idnum: "VALUE", lid: "VALUE"},
                            success : function(){
                            img.parent().fadeOut('slow');
                            }
                        }); 

                }
            },
            'No'    : {
                'class' : 'gray',
                'action': function(){}  // Nothing to do in this case. You can as well omit the action property.
                 }
               }
            });
        });
    });
    </script>

Answer 1

您缺少一些大括号，这不能真正解决问题，但首先检查此代码，我已使用必要的大括号进行格式化，并让我们知道您的发现:

Galleria.ready(function() {
this.$('thumblink').click();
$(".galleria-image").append( 
"<span class='btn-delete ui-icon ui-icon-trash'></span>"); 
$('.btn-delete').click(function(){
var elem = $(this).closest(".galleria-image").find('.item'); 
    $.confirm({
        'title'     : 'Delete Confirmation',
        'message'   : 'You are about to delete this item. <br />It cannot be restored at a later time! Continue?',
        'buttons'   : {
            'Yes'   : {
                'class' : 'blue',
                'action': function(){
                    elem.slideUp();
                          $.ajax({
                            url : 'delete.php',
                            type : 'post',
                            data : { image : img.attr('src'),  idnum: "VALUE", lid: "VALUE"},
                            success : function(){
                            img.parent().fadeOut('slow');
                            }
                        }); 

                }
            },
            'No'    : {
                'class' : 'gray',
                'action': function(){}  // Nothing to do in this case. You can as well omit the action property.
                 }
               }
            });
        });
    });

此外，您的成功调用函数缺少 data 参数