jQuery click inside each loop

Question

I want to loop my click events, to make the code shorter. I might have 30 of these values later on.

My working code

$(document).ready(function () {
    var last_click = '';

    $("#title").click(function() { last_click = 'title'; });
    $("#subtitle").click(function() { last_click = 'subtitle'; });
    $("#test").click(function() { last_click = 'test'; });
});

This is how I want it (not working)

My guess is that the each-loop runs on dom ready and then never again and that way the click-event can never be triggered?

$(document).ready(function () {
    var last_click = '';
    var contents = new Array();
    contents = ['title', 'subtitle', 'test'];

    $.each(contents , function(index, value){
        $("#" + value).click(function() { last_click = value; });
    });
});

If there is not solved like I would, I would be thankful for a nice workaround.

What you have should work.. What do you mean by triggering click event? You are binding the click event to list of elements in contents. — Selvakumar Arumugam
– Selvakumar Arumugam, Commented Oct 12, 2012 at 14:25
Just a side note: your new Array() in contents is clobbered in the next line by another array; it's not needed. — apsillers
– apsillers, Commented Oct 12, 2012 at 14:33

st3inn · Accepted Answer · 2012-10-12 14:27:06Z

6

I would rather add a class to all elements you want to bind this to, eg class="last-click" and define the binding once as:

$(".last-click").on('click', function() {
    last_click = this.id;
}

answered Oct 12, 2012 at 14:27

st3inn

1,5961 gold badge9 silver badges18 bronze badges

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

Comments

user400654 · Accepted Answer · 2012-10-12 14:26:30Z

0

If you really wanted to make it shorter, give them all a similar class.

$(document).ready(function () {
    var last_click = '';    
    $(".theclass").click(function() { 
        last_click = this.id; 
    });
});

answered Oct 12, 2012 at 14:26

user400654

95.1k16 gold badges168 silver badges188 bronze badges

Comments

Caner Akdeniz · Accepted Answer · 2012-10-12 14:32:00Z

0

if you have value attribute for your buttons or elements, you can do it:

$(document).ready(function() {
    var last_click = '';
    $("input").click(function() {
        last_click = $(this).attr('value');
        alert(last_click);
    });    
});

I assumed that you are using "input type="button". Also here is the demo you can see it in action: http://jsfiddle.net/rS2Gb/5/

answered Oct 12, 2012 at 14:32

Caner Akdeniz

1,86214 silver badges20 bronze badges

Collectives™ on Stack Overflow

jQuery click inside each loop

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related