jquery: :submit selector not working ?

Question

I have an html page which contains a button like this.

<input id="qsbButton" class="btn" type="submit" tabindex="10" value="Search" name="qsbButton" onclick="searchSubmitted();return true;"/>


$(':image,:reset,:button,:submit').unbind("click")
.bind('click',function(e){
alert("clicked!");
});

$('input:not(:submit),textarea').change(function(e){
alert("typed something!");
});

I expected to received "clicked!" alert but nothing...no error messages.

Answer 1

Inline messages are not "bound" in the traditional sense of the word depending on the browser. Thus, you cannot call unbind to remove them. This is the code you need to override inline functions:

$(':image,:reset,:button,:submit').each(function(){
    this.onclick = null;
    $(this).bind('click',function(e){ alert("clicked!"); });
});

And the rest of your code should function as normal.

EDIT This can be more "jQuery-like" if written this way, and it would probably run faster than the code shown above.:

$(':image,:reset,:button,:submit')
    .removeAttr('onclick')
    .click(function(e){ alert("clicked!"); });