jquery id identifier

Question

Possible Duplicate:
Wildcards in jQuery selectors

Say I have several buttons on my page, with id tags as id_1, id_2, id_3 etc

I want a function to cover all of them being pressed, so something that checks if the first 3 characters are id_.

 $("?????").click(function(event) {

What replaces the ??????

I can't use classes instead, in this instance.

Oliver Spryn · Accepted Answer · 2012-07-21T15:46:10.973

4

This would also work:

$('[id^=id_]').click(function() {
  //Do stuff here
});

This selects all elements whose id attribute begins with id_, so id_1, id_2, id_3, etc... would all be selected.

However, it might be more appropriate to use the class attribute as a selector. Unlike the id attribute, the class attribute does not have to be unique. So, for example, you can have 5 buttons on your page, each with a class name of clickMe, and employ the following code which will listen for a click on any of the buttons:

$('.clickMe').click(function() {
  //Do stuff here
});

Hope that helps.

edited Jul 21 '12 at 15:46

answered Jul 21 '12 at 15:38

Oliver Spryn

16,871
33
101
195

Just a little question. The `[id` part means "with attribute id" and the rest means "starting with `id_`", right? – Linuxios Jul 21 '12 at 15:43
@Linuxios Yes, the `[id` portion is the name of the attribute, and `id_` is the beginning of the attribute value. – Oliver Spryn Jul 21 '12 at 15:47
Thanks! Now I know a cool jQuery trick. – Linuxios Jul 21 '12 at 15:50
@Linuxios if you found my answer helpful, could you please hit the checkmark beside it? – Oliver Spryn Jul 21 '12 at 15:58
Little misunderstanding here. I'm not the Op. ;)! – Linuxios Jul 21 '12 at 16:00
Ummm... yeah. Sorry, now I see that. ;) – Oliver Spryn Jul 21 '12 at 16:09

score 2 · Answer 2 · answered Jul 21 '12 at 15:35

2

How about this (I'm pretty new to JavaScript, might not work):

for(var i = 0; i < maxId; i++) {
  $("#id_"+i).click(function(e) {
    //Blah blah blah
  });
}

answered Jul 21 '12 at 15:35

Linuxios

34,849
13
91
116

@spryno724: Thanks! Sometimes I pull things out of my hat the work. Other times, not. Glad this was a time that works :). – Linuxios Jul 21 '12 at 15:36
you missed out the closing brace for the `click(function(e) { });` – Andy Lobel Jul 21 '12 at 15:36
2

The for loop is unnecessary, when you can use `^=` (see [duplicate question](http://stackoverflow.com/questions/5376431)) – nico Jul 21 '12 at 15:38
@Linuxios Sorry my quick scan didn't notice that. lol – Oliver Spryn Jul 21 '12 at 15:38
@nico: I know. But I know bery little about JS, so this is all I knew how to do. But my +1 goes to spryno for his elegant answer. – Linuxios Jul 21 '12 at 15:39
@Linuxios: well, now you know another trick ;) – nico Jul 21 '12 at 15:40
@nico: Learn something new everyday on SO, eh? – Linuxios Jul 21 '12 at 15:41

The Alpha · Answer 3 · 2012-07-21T15:40:48.910

1

Try this

$(function(){
    $('button[id^="id_"]').on('click', function(e){
        alert($(this).attr('id'));
    });
});

Here's an example.

edited Jul 21 '12 at 15:40

answered Jul 21 '12 at 15:39

The Alpha

143,660
29
287
307

jquery id identifier

3 Answers3