JQuery: Comment détecter les clics sur les icônes à l'intérieur de li?

Question

J'ai une icône dans une liste, je voudrais simplement être en mesure de détecter la double clic sur l'icône - pour que je puisse supprimer la liste, comment est-ce possible (JQuery Sortable)

$("#roleList").dblclick(function(e) { 
    var text = $(e.target).html(); 
    $(e.target).fadeOut('slow', function() { 
     $("#deleteList").append(e.target); 
    }); 
}); 


<ul id="roleList" class='droptrue'> 
    <li class="ui-state-default" id="20~Role 1"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span><input id="20" name="20" type="text" value="Director General" /></li>                    
<li class="ui-state-default" id="1~Role 2"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span><input id="1" name="1" type="text" value="Director" /></li> 
</ul> 

Alors Je veux détecter le clic sur la classe "ui-icon ui-icon-arrowthick-2-n-s" afin que je puisse déclencher un .fadeout et "supprimer" cet élément de la liste.

Je devine que si je peux le faire, cela ne marchera pas:

var text = $(e.target).html(); 
$(e.target).fadeOut('slow', function() { 
    $("#deleteList").append(e.target); 
}); 

Je vais devoir faire un e.target.parent? Parce que je voudrais .fadeout l'intégralité <li> et pas seulement l'icône.

Toute aide serait appréciée

Answer 1

Vous pouvez essayer celui-ci:

$(".ui-icon").live("dblclick", function(){ 
    $(this).remove(); 
}); 

Cela ajoutera un événement double-clic pour tout élément avec une classe ui-icône qui, lorsqu'il est exécuté supprimera l'élément. Si vous souhaitez supprimer l'élément li parent avec un fondu:

$(".ui-icon").live("dblclick", function(){ 
     $(this).parent('li:first').fadeOut('slow', function(){ 
     $(this).remove(); 
     }); 
}); 

J'espère que c'est ce que vous cherchez