Category Archives: jQuery

jQuery ready, delegate, live!

Recently I was browsing through the jQuery subr reddit and noticed this question pop up. Since I am sure this is a pretty common question on “Why won’t my jQuery command work properly”, I figured I would give a shot at answering it.

Hey guys, I’m sure this has been answered before but I can’t seem to find anything by searching Google or /r/jquery.

I am a beginner with this so forgive me, but I can’t find an explanation to this anywhere and I’m curious. When I try to stop the default submit function of a form in the <head> tag of a .html file it won’t work, but when I copy and paste the same code into the <body> it works fine. Regardless of where I place it, it is always below the link to the jquery library. This is really confusing and I was hoping you guys could explain this for me. Thanks!

via jQuery <script> in <body> or *lt;head>.

Continue reading

Writing and Updating DOM Elements in a Frame

Handling writing and updating objects in an iframe can be bothersome in most browsers. Sure things like jQuery tend to help, but not always.

A normal way to access a frame in jQuery is below:


Now, lets say you actually want to get another element inside of the frame, lets get the HEAD element.


Continue reading

Expanding the jQuery Plugin Development Pattern

Doing research on a recent project, I came across an article by Mike Alsup on a “jQuery Plugin Development Pattern”.
If you haven’t seen it already its worth a trip to to checkout the implementation of his pattern.

“There are a few requirements that I feel this pattern handles nicely:”

  1. Claim only a single name in the jQuery namespace
  2. Accept an options argument to control plugin behavior
  3. -Provide public access to default plugin settings-
  4. Provide public access to secondary functions (as applicable)
  5. Keep private functions private
  6. Support the Metadata Plugin
  7. Allow for extending the object via callbacks (either hooks or events) as applicable
  8. Scope all selectors with the ‘this’ object

Continue reading

jQuery 1.5 Deferreds

Eric Hynds on his blog the other day gave a very good run down of jQuery 1.5 Deferreds. From the post:

Deferreds, new in jQuery 1.5, decouple logic dependent on the outcome of a task from the task itself. They’re nothing new to the JavaScript scene; Mochikit and Dojo have implemented them for some time, but with Julian Aubourg’s AJAX rewrite landing in 1.5, deferreds in jQuery was the logical next step. With deferreds, multiple callbacks can be bound to a task’s outcome, and any of these callbacks can be bound even after the task is complete. The task in question may be asynchronous, but not necessarily.

Continue reading

$(“#ID”) is fast enough

We all know that the fastest selector to use is the ID. Something like $(“#id”) is better than using a class. However,
after looking at the last test we did on The Great Assumption – JavaScript I noticed
a large discrepancy in $(“#ID”) versus the native document.getElementById().

Now, I always assumed it was slower, but not anywhere near close to what I saw. So, lets challenge the assumption that $(“#ID”) is good enough.

Continue reading

The Great Assumption – Javascript

A couple of weeks ago I was sitting down with a Google Frontend Engineer friend of mine, talking about some of the JavaScript best practices we all have come to know and abide by. I found myself in agreement with 90% of everything we were talking about. However, something kept eating at me. Why do we both agree on these things? Is it because we actually sat down and did some test? Or is more because early in our careers we were told it was the correct way and have never gone about challenging our assumptions.

So with this post, I am going to start challenging our assumptions on what’s right, OR validate those assumptions with some documented proof. Thus begins our first in a series of posts about performance, and a “Do this, Not that” series. Some of the posts will focus on jQuery, others on core JavaScript, however all of them should give you some insight on what to do in the future.

Continue reading

Custom Events in jQuery

*quick note: I originally posted this on However its time to move sites and actually keep something up and running for a while.

Events seem daunting at first, but really jQuery makes them super simple. Events can be used to alter behavior or even have multiple events happen on a single state change.

We all know about events like click, onkeydown, onmousedown, onmouseover, etc. But you can fire custom events as well. First you need to understand how to fire events. You can do this by using the $().trigger() event through jQuery.

Continue reading