Demo of Selectable unselected event using JQuery

  • Item 1
  • Item 2
  • Item 3
  • Item 4
  • Item 5
Press and hold Ctrl key for multiple selection


Tutorial Selectable

JQuery

$(document).ready(function() {
//////////////////////////
$( '#my_selectable' ).selectable({
unselected: function( event, ui ) {
$('#d1_unselected').html('unselected : I am unselected');	
}
});
///
$( "#my_selectable" ).on( "selectableunselected", function( event, ui ) {
$('#d1_event_listener').html('I am through event listener ');		
} );
///
})

HTML

<ul id="my_selectable">
  <li id=i1>Item 1</li>
  <li id=i2>Item 2</li>
  <li id=i3>Item 3</li>
  <li id=i4>Item 4</li>
  <li id=i5>Item 5</li>
</ul>

<div id=d1_unselected></div><br>
<div id=d1_event_listener></div>