Book Image

Learning jQuery - Fourth Edition - Fourth Edition

Book Image

Learning jQuery - Fourth Edition - Fourth Edition

Overview of this book

To build interesting, interactive sites, developers are turning to JavaScript libraries such as jQuery to automate common tasks and simplify complicated ones. Because many web developers have more experience with HTML and CSS than with JavaScript, the library's design lends itself to a quick start for designers with little programming experience. Experienced programmers will also be aided by its conceptual consistency. LearningjQuery - Fourth Edition is revised and updated version of jQuery. You will learn the basics of jQuery for adding interactions and animations to your pages. Even if previous attempts at writing JavaScript have left you baffled, this book will guide you past the pitfalls associated with AJAX, events, effects, and advanced JavaScript language features. Starting with an introduction to jQuery, you will first be shown how to write a functioning jQuery program in just three lines of code. Learn how to add impact to your actions through a set of simple visual effects and to create, copy, reassemble, and embellish content using jQuery's DOM modification methods. The book will take you through many detailed, real-world examples, and even equip you to extend the jQuery library itself with your own plug-ins.
Table of Contents (24 chapters)
Learning jQuery Fourth Edition
Credits
Foreword
About the Authors
About the Reviewers
www.PacktPub.com
Preface
Index

Event methods


To react to user behavior, we need to register our handlers using these event methods. Note that many DOM events only apply to certain element types; these subtleties are not covered here. Event methods are discussed in detail in Chapter 3, Handling Events.

Binding

Event method

Description

.ready(handler)

Binds handler to be called when the DOM and CSS are fully loaded.

.on(type, [selector], [data], handler)

Binds handler to be called when the given type of event is sent to the element. If selector is provided, performs event delegation.

.on(events, [selector], [data])

Binds multiple handlers for events as specified in the events object parameter.

.off(type, [selector], [handler])

Removes bindings on the element.

.bind(type, [data], handler)

Binds handler to be called when the given type of event is sent to the element. In general, use .on() instead.

.one(type, [data], handler)

Binds handler to be called when the given type of event is sent to the element. Removes the binding when the handler is called.

.unbind([type], [handler])

Removes the bindings on the element (for an event type, a particular handler, or all bindings).

.delegate(selector, type, [data], handler)

Binds handler to be called when the given type of event is sent to a descendant element matching selector.

.delegate(selector, handlers)

Binds a collection of handlers to be called when the given types of events are sent to a descendant element matching selector.

.undelegate(selector, type, [handler])

Removes the bindings on the element previously bound with .delegate().

Shorthand binding

Event method

Description

.blur(handler)

Binds handler to be called when the element loses keyboard focus.

.change(handler)

Binds handler to be called when the element's value changes.

.click(handler)

Binds handler to be called when the element is clicked.

.dblclick(handler)

Binds handler to be called when the element is double-clicked.

.error(handler)

Binds handler to be called when the element receives an error event (browser-dependent).

.focus(handler)

Binds handler to be called when the element gains keyboard focus.

.focusin(handler)

Binds handler to be called when the element, or a descendant, gains keyboard focus.

.focusout(handler)

Binds handler to be called when the element, or a descendant, loses keyboard focus.

.keydown(handler)

Binds handler to be called when a key is pressed and the element has keyboard focus.

.keypress(handler)

Binds handler to be called when a keystroke occurs and the element has keyboard focus.

.keyup(handler)

Binds handler to be called when a key is released and the element has keyboard focus.

.load(handler)

Binds handler to be called when the element finishes loading.

.mousedown(handler)

Binds handler to be called when the mouse button is pressed within the element.

.mouseenter(handler)

Binds handler to be called when the mouse pointer enters the element. Not affected by event bubbling.

.mouseleave(handler)

Binds handler to be called when the mouse pointer leaves the element. Not affected by event bubbling.

.mousemove(handler)

Binds handler to be called when the mouse pointer moves within the element.

.mouseout(handler)

Binds handler to be called when the mouse pointer leaves the element.

.mouseover(handler)

Binds handler to be called when the mouse pointer enters the element.

.mouseup(handler)

Binds handler to be called when the mouse button is released within the element.

.resize(handler)

Binds handler to be called when the element is resized.

.scroll(handler)

Binds handler to be called when the element's scroll position changes.

.select(handler)

Binds handler to be called when text in the element is selected.

.submit(handler)

Binds handler to be called when the form element is submitted.

.unload(handler)

Binds handler to be called when the element is unloaded from memory.

.hover(enter, leave)

Binds enter to be called when the mouse enters the element, and leave to be called when the mouse leaves it.

Triggering

Event method

Description

.trigger(type, [data])

Triggers handlers for the event on the element and executes the default action for the event.

.triggerHandler(type, [data])

Triggers handlers for the event on the element without executing any default actions.

Shorthand triggering

Event method

Description

.blur()

Triggers the blur event.

.change()

Triggers the change event.

.click()

Triggers the click event.

.dblclick()

Triggers the dblclick event.

.error()

Triggers the error event.

.focus()

Triggers the focus event.

.keydown()

Triggers the keydown event.

.keypress()

Triggers the keypress event.

.keyup()

Triggers the keyup event.

.select()

Triggers the select event.

.submit()

Triggers the submit event.

Utility

Event method

Description

$.proxy(fn, context)

Creates a new function that executes with the given context.