Ben Rudolph
Ben Rudolph

Reputation: 2517

Javascript change event kills click event

This occurs when I bind a change event to a textarea and then a clickevent to a button. If I'm focused in the textarea and have made a change and then click on the button, only the change event fires. An example is here: JSFiddle

JS:

$(function() {
    $('textarea').change(function() {
        alert('mefirst')
    });
    $('#submit').click(function(e) {
        alert('hi');
    });
});

HTML:

<textarea name="details" rows="5"></textarea>
<input type="submit" id="submit"/>

If you unbind the textarea the click event will work as expected. Any suggestions would be helpful (happens in Chrome and Firefox).

Upvotes: 0

Views: 148

Answers (1)

beng
beng

Reputation: 38

The problem is with the alerts, both the change and click event is firing but the browser doesn't know what to do with 2 alerts. If the alert() is changed to console.log(), both events are logged.

 $('textarea').change(function() {
    console.log('changed')
});
$('#submit').click(function(e) {
    console.log('submitted');
});

http://jsfiddle.net/p0t1pzh7/13/

Upvotes: 1

Related Questions