Web Development with jQuery®

(^72) ❘ CHAPTER 3 EVENTS
border-radius: 5px;
}
div.finderDirectoryName,
div.finderFileName {
text-align: center;
}
span.finderDirectoryNameSelected,
span.finderFileNameSelected {
background: rgb(56, 117, 215);
border-radius: 8px;
color: white;
padding: 1px 7px;
}
And fi nally, the JavaScript is modifi ed to use a persistent event, as well as to add some new fi les
when you double-click anywhere on the document to test the concept of a persistent event handler.
$(document).on(
'DOMContentLoaded',
function()
{
$('div#finderFiles').on(
'click',
'div.finderDirectory, div.finderFile',
function(event)
{
$('div.finderIconSelected')
.removeClass('finderIconSelected');
$('span.finderDirectoryNameSelected')
.removeClass('finderDirectoryNameSelected');
$('span.finderFileNameSelected')
.removeClass('finderFileNameSelected');
$(this).find('div.finderIcon')
.addClass('finderIconSelected');
$(this).find('div.finderDirectoryName span')
.addClass('finderDirectoryNameSelected');
$(this).find('div.finderFileName span')
.addClass('finderFileNameSelected');
}
);
$('div#finderFiles div.finderNode:first')
.trigger('click');
var addedAdditionalFiles = false;
$('body').dblclick(
function()
{
if (addedAdditionalFiles)
http://www.it-ebooks.info