を追加してください。アイコンをボタンにゴミ箱

Question

私は誰かが私を助けることができるかどうか疑問に思う。

アイコン付きの削除ボタンを作成するには、以下のコードを使用しています.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スクリプトのアイコン名を含めましたが、私は実際にアイコンを作成することができませんでしだと私は次に何をすべきか本当にわかりません。私はちょうど誰かがこれを見て、私がアイコンをどのように変更することができるかについて何か助けを与えることができるかどうか疑問に思った。

多くのおかげでここで

Answer 1

についてのみ、ゴミ箱のアイコンを表示する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/