0

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

我正在使用下面的代码创建一个带有图标的删除按钮，当与 Javascript 结合使用时，它允许用户从图库页面中删除图像。

我目前正在使用已下载的图标，但如果可能的话，我想使用的是 ui.Trash 图标。

我是第一个承认我不是特别精通应用 .css 文件和设置的人，而且我花了相当长的时间来整理当前的脚本。

从我一直在阅读的内容来看，我认为我说图像是通过跨度类调用的是正确的？我试着用这个来代替，url但这会导致我的画廊风格有点不对劲。

<style>

         .galleria-thumbnails .btn-delete {    
          display: block;  
          position: absolute; bottom : 0px;  
          width: 80px;     
          height: 80px;    
          cursor: pointer;     
          background: url(trashout.png) no-repeat bottom; } 

        </style>

    <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"); 

        // send the AJAX request
        $.ajax({
        url : 'delete.php',
        type : 'post',
        data : { image : img.attr('src') },
        success : function(){
        alert('Deleting image... ');
        img.parent().fadeOut('slow');
        }
        });

        return false;
        });

        });

    </script>

我已经在我的 AJAX 脚本中包含了图标名称，但我无法实际创建图标，而且我不确定下一步该做什么。我只是想知道是否有人可以看看这个并就如何更改图标提供一些帮助。

非常感谢和问候

4

1 回答 1

0

这是一个仅显示垃圾桶图标的 jQuery UI 按钮示例：

<button class="table-delete-link" title="Delete" href="delete-example.php?id=17">
    <span class="ui-icon ui-icon-trash"></span>
    <span class="ui-button-text">Delete</span>
</button>


$(document).ready(function() {
    $('button.table-delete-link').click(function () {
        var targetUrl = $(this).attr('href');
        $.ajax({
            url: targetUrl,
            type: 'GET',
            success: function (data, textStatus, xhr) {
                alert('Item successfully deleted!');
            },
            error: function (xhr, textStatus, errorThrown) {
                var errorMessage = xhr.responseText;
                errorMessage = errorMessage.substring(errorMessage.indexOf('<title>') + 7, errorMessage.indexOf('</title>'));
                alert('Unable to delete item: ' + errorMessage);
            }
        });
        return false;
    });
});

在 jsFiddle 上查看此操作：http: //jsfiddle.net/jimmym715/qpDha/

于 2012-05-12T21:40:35.410 回答