jQuery onclick selector doesn't work

Question

$("input[type='button'][onclick^='save']")

and it works in FF but on IE...

There is something wrong with onclick selector part. Is there a way to make cross-browser workaround?

Thanks Pawel

edit:

    $("img[src$='scroll.gif']").click(function(){
    var targetOffset = $("input[type='button'][onclick^='save']").offset().top; 
    $("html,body").animate({scrollTop: targetOffset}, 400);
});

Answer 1

It should be like :

$("input[type=button]").click(function(){
//do something
});

You should put this in document ready function

EDIT is this what you want?

$('img[src="scroll.gif"]').click(function(){
        var targetOffset = $(this).offset().top; 
        $("html,body").animate({scrollTop: targetOffset}, 400);
    });

Answer 2

Do you have more than one button that is a save button? If not, why don't you just assign your button an id? That makes it a lot simpler, and the id selector, which wraps document.getElementById() is very cross-platform. Then, all you need is $("#buttonID").

EDIT: Given the OP's criteria, I'd suggest a class (just for use as a selector) such as "jumpToSave". Each button should have that class, and then the selector could use $(".jumpToSave")

Answer 3

You can't look for a value like that in event attributes. The browser creates a function from the string value in the attribute.

If you have an attribute like this:

onclick="save();"

The attribute contains a function reference rather than a string. If you read the attribute and get the value as a string, you get the code of the function.

When reading the attribute value in Firefox, this is what you get:

function onclick(event) { save(); }

When reading the attribute in Internet Explorer, this is what you get:

function onclick(){save();}

You have to use some other attribute to identify the button.