Blur event doesn't fire when navigating away from input field

Question

When I move out of my input field the blur function doesn't fire.

Any idea's?

<input type="text" value="test" id="webshop_product_url_part" name="setting" class="is"/>

jQuery("input.is").live("blur", function(){
      console.log("2");
      conslole.log("asdf");

     });

Answer 1

Looking on jQuery live() documentation

Binds a handler to an event (like click) for all current - and future - matched element. Can also bind custom events.

Possible event values: click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, keydown, keypress, keyup

Currently not supported: blur, focus, mouseenter, mouseleave, change, submit

Answer 2

live uses event delegation to work. This means that only events that bubble can take advantage of it. Events that do no bubble, and therefore cannot utilize event delegation (jQuery's live), include blur and focus, among others.

The only way around this is to bind the event to every element. When you append and element, bind it then. You could also write a plugin of sorts that adds parameters to jQuery's append, allowing you to specify an event and it's associated handler for all elements that match your selector.