Friday, February 17, 2012

JQuery code not working


I am trying to find a cell in a table that has a class of 'empty', i am then using a bit of code to find the id(cell number) so i can the find out what cells are next too it.



just too see if it works, i am trying:




console.log($('.empty').attr('id'));



but Firebug just returns 'undefined'



each cell has the class of 'box' and only one has empty as well so 'box empty'.



Any asssitance would be much appreciated.

2 comments:

  1. Probably the DOM isn't ready. Put the code inside the on DOM ready event:

    $(function(){console.log($('.empty').attr('id'));});
    //or
    $(document).ready(function(){console.log($('.empty').attr('id'));});




    Update:

    Based on the Markup you wrote, the selector you need is attribute selector not class:

    <td id="B" class="leftbox" name="empty" ondragover="allowDrop(event)"
    ondrop="drop(event,this.id)"> </td>

    $(function(){console.log($('input[name="empty"]').attr('id'));});

    ReplyDelete
  2. $('.empty') return an array of dom element, so you must use a loop (for, each...) to analyse results

    $('.empty').each(function() {
    console.log( $(this).attr('id') );
    }


    If you are sure there is only one element, you can use :

    console.log( $('.empty:first').attr('id') );

    ReplyDelete