target.event by JQuery executed multiple times

Question

This is my current code:

function tableClick(event){
    $('#table').click(function(event){
        alert(event.target.id);     
    });
}

<table id="table">
    <tr>
        <td id="td1" onclick="tableClick(this)">
            1
        </td>
    </tr>
    <tr>
        <td id="td2" onclick="tableClick(this)">
            2
        </td>
    </tr>
</table>

What I don't understand is why it pops up the alert window one more time than last. How can I fix this? Thanks in advance.

James Montagne · Accepted Answer · 2013-06-11 14:57:54Z

4

Each time you click, you call this function.

function tableClick(event){
    $('#table').click(function(event){
        alert(event.target.id);     
    });
}

This part:

$('#table').click(function(event){

attaches a click handler to the table. Every time you click you attach a new click handler to the table.

answered Jun 11, 2013 at 14:57

James Montagne

78.9k14 gold badges115 silver badges132 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Adil Shaikh · Accepted Answer · 2013-06-11 14:58:41Z

1

Because you are attaching click handler on every click -

You can do this -

function tableClick(this){
     alert(this.id);     
}

answered Jun 11, 2013 at 14:58

Adil Shaikh

44.8k17 gold badges95 silver badges112 bronze badges

1 Comment

user1888955 Over a year ago

Thank. But it seems this doesn't work. So I keep it as tableClick(event) {alert(event.id);} and it workds

Collectives™ on Stack Overflow

target.event by JQuery executed multiple times

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related