Web Development with jQuery®

Creating Buttons to Apply Bold, Italic, Underline, Font, and Font Size (^) ❘ 471
border: 1px solid black;
border-radius: 3px;
}
button.bold {
font-weight: bold;
}
button.italic {
font-style: italic;
}
button.underline {
text-decoration: underline;
}
Finally, include the following JavaScript (Example 22-2.js) for handling the events for the
toolbar buttons:
$(document).ready(
function()
{
$('button.toolbar-btn').click(
function()
{
var data = this && $(this).data && $(this).data();
if (data && data.format && document.execCommand)
{
document.execCommand(data.format, false, null);
$('div#container').focus();
}
}
);
$('select.toolbar-ddl').change(
function()
{
var data = this && $(this).data && $(this).data();
if (data && data.format && document.execCommand)
{
document.execCommand(data.format, false,
this[this.selectedIndex].value);
this.selectedIndex = 0;
$('div#container').focus();
}
}
);
}
);
This code results in the document shown in Figure 22-2.
http://www.it-ebooks.info