Tequila Fish Ran-dumb ramblings of me…

4Dec/07Off

jQuery: How to get the ID of an element.

Say you want to know the ID of an element using jQuery. You can achieve this easily using jQuery's attr() method:

var currentId = $('#element').attr('id');

But this is fairly useless, because it requires you to already know the ID of the element that you want. Usually you'll want to find out the ID if you don't already know it -- given a jQuery 'this' object:

var currentId = $(this).attr('id');

This will only work provided that you have a valid jQuery object $(this) that you are working with, eg:

$(document).ready(function() {
  $('input.text').focus(function() {
    $('input.text').removeClass('onFocus'); /* remove focus state from all input elements */
    $(this).addClass('onFocus'); /* add focus state to currently clicked element */
    var currentId = $(this).attr('id');
  });
};

Using the code above, you will now know the ID of the currently focused input element. This can come in handy later on if you want to perform further actions on the element.

----------------
Now playing: Amon Tobin - Precursor (feat. Quadraceptor)
via FoxyTunes

Comments (22) Trackbacks (0)
  1. Thanks buddy! Forgot about the brackets.

  2. thanks alot !!
    usefull and short :)

  3. Thank you very much, “attr(’id’);” this one saved my time.

  4. Exactly what i needed. I was searching for this. Thank you :)

  5. That’s what I need!
    Thank you!! :)

  6. Gotta love jquery, thanks for that info.

  7. Thanks I was on this state of mind when you can’t think different than pure javascript and wanted a 2 second reminder of jquery basics lol

  8. Thank u very much
    It’s saved my time.

  9. Just have to be aware that the element might not have an id, so at any time that id could just be blank or null, whichever .attr() returns.

  10. Why not just use:
    var currentId = this.id
    jQuery is awesome but don’t forget your JavaScript basics.

  11. Works really well when combined with the new functions such as closest(), for example to find the table row id containing the button that was clicked you can write
    var RowID = $(this).closest(“tr”).attr(‘id’);

    which then makes getting other data in the row much easier. Instead of
    var ErrorDate = $(this).closest(“tr”).find(“td.ErrorDate:first”).text() ;

    you end up with
    var ErrorDate = $(‘#’ + RowID + ” td.ErrorDate:first”).text() ;

  12. @stuntant … um… I’m not javascript expert, but don’t you mean:
    var currentId = this.getAttribute(‘id’)
    ?

  13. No Em that’s not what he meant :)

  14. Works! Thanks for your tip dude.

  15. @Dylan Are you really saying that:

    var RowID = $(this).closest(“tr”).attr(‘id’);
    var ErrorDate = $(‘#’ + RowID + ” td.ErrorDate:first”).text() ;

    is easier than:

    var ErrorDate = $(this).closest(“tr”).find(“td.ErrorDate:first”).text();

    If you want to pull more than one piece of data from the row, then, rather than keeping the ID, you shuold keep the jQuery object for the row like:

    var $row = $(this).closest(“tr”);
    var ErrorDate = $row.find(“td.ErrorDate:first”).text();

    @stuntant I agree that using this.id is better in many cases, but it doesn’t work if you want to do somethng like:

    $(this).parent().attr(‘id’);

  16. Thanks a lot

  17. Why make it hard (and slow) when it’s already simple (and fast)?

    var currentId = this.id;

  18. very helpful..Thanks a lot..

  19. I’m trying to do the following:

    photoName = $(“#photoName”).attr(‘var’);
    $(“#” + photoName).remove();

    <div id="”>

    <div id="photoName" var="”>

    can’t make it work.

  20. hello how to get and random id for element not have id
    thank you

  21. how to get id of all same class name element ?

    for example :

    i want to find id of all div from its classname…

    thnaks

    Vasim Padhiyar


Trackbacks are disabled.