4. Saving the state
jQuery.data( element, key[, value] )
Store any kind of information on a DOM
element
Circular references avoided
Low level function use
$( element ).data( key[, value] ) instead.
5. Removing the state
jQuery.removeData( element[, key] )
Low level function use
$( element ).removeData( [key] )
instead.
Removes all data if no key is passed.
6. State example
var $logo = $('#jq-siteLogo');
$(document).data('logo', $logo);
$logo.detach();
$('#content').before($(document).data('logo'));
$(document).removeData('logo');
7. Hidden events
getData[.namespace]
Emitted, when the content is read.
setData[.namespace]
Emitted, when the content is set or reset.
changeData[.namespace]
Emitted, when the content has been changed.
Comes always in hand with the setData event.
8. Hidden events (II)
var foo = $('div');
foo.bind('changeData.data', function( event, key, value ) {
var data = new Array(value);
$('#activitystream').trigger('myCustomEvent', data);
});
foo.data('my.data', 'Tux is a mascott.');
9. Extending for the good
jQuery.extend([deep], target[, object1][,objectN])
var empty = {};
var defaults = {
validate : false,
limit : {max: 5, min: 1},
name : "foo"
};
var options = {
validate : true,
limit : {max:10}
};
var settings = $.extend(true, empty, defaults, options);
10. User defined properties
Register of translations
Used by .attr( )
jQuery.propFix = {
for : "htmlFor",
class : "className",
…
};
jQuery.extend(
jQuery.propFix,
{uijgh : "ui-jeopardy-gameboard-header"}
);
11. DOM attributes
Applies for every entry in jQuery.attrFn
(e.g. val, css, text, data, … )
var tux = $("<div/>", {
css : {background: '#AAA'},
text : 'beastie'
});
$("div")['css']({background: '#BBB'});
14. Global AJAX events
ajaxStart
everytime a new request has been fired and no request s running
ajaxStop
everytime no request is running anymore
ajaxComplete
once for each completed request (success or failure)
15. Global AJAX events (II)
ajaxError
once for each failed request
ajaxSuccess
once for each successful request
ajaxSend
once for each request, but before the request is send
23. jQuery UI
jQuery.extend('ui.autosuggest.prototype, {
_search: function( value ) {
// always save the actual value,
// not the one passed as an argument
this.term = this.element
.addClass( "ui-autocomplete-loading"
.val();
this.source( { term: value }, this.response );
});
25. Slides'n contact
Please comment the talk on joind.in
http://joind.in/3833
Slides
http://slideshare.net/lapistano
Email:
lapistano@php.net
26. License
This set of slides and the source code
included
in the download package is licensed under
the
Creative Commons Attribution-
Noncommercial-Share Alike 2.0 Generic
License