HTML and CSS Reference
In-Depth Information
processing before the DOM has loaded, in which case elements will not be available when
selected:
//
Technically in our case we do not need to worry about this, since our script is
declared at the bottom of the page. It is however a good habit to use the approach
suggested below, even in this case.
In order to detect that the DOM has fully loaded we can listen for the ready event:
$(document).ready()
As with all event listeners, this accepts a callback function, therefore we will change the
code as follows:
$(document).ready(function() {
$('[required="required"]').prev('label').append( '<span>*</span>').children( 'span').addClass('required');
$('tbody tr:even').addClass('even');
$('#btnAddTask').click(function(evt) {
evt.preventDefault();
$('#taskCreation').removeClass('not');
});
$('tbody tr').click(function(evt) {
$(evt.target).closest('td').siblings( ).andSelf( ).toggleClass( 'rowHighlight');
});
$('#tblTasks tbody').on('click', '.deleteRow', function(evt) {
evt.preventDefault();
$(evt.target).parents('tr').remove();
});
});
If you need to delay code execution until all resources have loaded, the load event can be
used instead:
$(document).load()
 
Search WWH ::




Custom Search