jQuery attr('onclick')

Question

I'am trying to change "onclick" attribute in jQuery but it doesn't change, here is my code:

$('#stop').click(function() {
     $('next').attr('onclick','stopMoving()');
}

I have an element with id="stop" and when user clicks on it I want to change an onclick attribute on element which has id="next".

If someone knows where is the solution please help!

Solution 1

Do it the jQuery way (and fix the errors):

$('#stop').click(function() {
     $('#next').click(stopMoving);
     // ^-- missing #
});  // <-- missing );

If the element already has a click handler attached via the onclick attribute, you have to remove it:

$('#next').attr('onclick', '');

Update: As @Drackir pointed out, you might also have to call $('#next').unbind('click'); in order to remove other click handlers attached via jQuery.

But this is guessing here. As always: More information => better answers.

Solution 2

As @Richard pointed out above, the onClick needs to have a capital 'C'.

$('#stop').click(function() {
     $('next').attr('onClick','stopMoving()');
}

Solution 3

The easyest way is to change .attr() function to a javascript function .setAttribute()

$('#stop').click(function() {
    $('next')[0].setAttribute('onclick','stopMoving()');
}

Comments

[Peter Perháč]

use the code as Felix posted. Using jQuery you should not think of changing the onclick attribute of an element, but of attaching a click event listener to the element, which is done via the jQuery click() method.

[mikerobi]

Not enough info to be sure, but the OP is probably better off with $('#next').one('click', stopMoving)

[Richard Marskell - Drackir]

You should use: $('#next').unbind('click'); Also, you have "onlick" instead of "onclick". :)

[Felix Kling]

@mikerobi: I think you mean .one('click', stopMoving). Yeah, maybe.... we don't know.

[Shark]

it couldn't solve my broblem i need the way to change "onclick" attribute via attr('element','value')

[Felix Kling]

@ShakoKakauridze: Could you create a demo? The code above will work. You have to explain what exactly did not work the way it should.

[Chris Harrison]

The problem with these sorts of answers is they don't answer the question. These people don't realise that sometimes you are dealing with other people's code. Of course normally you would use the click function in jQuery. OF COURSE. But, I've a situation where I need to append something to the onClick event that is pre-exisitng. There are variables hardcoded into the HTML. I can't change the HTML.

[Emdadul Sawon]

I want exactly this. Write the onclick on html, not just attach event.

[Tran Audi]

$('#next') you are missing # :)