Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Add number to IDs

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #36249
    schart
    Participant

    So, what I’m saying is that I want a unique number to each div with the specific ID.
    Example:


    Top 1

    Top 2

    Top 3

    Bottom 1

    Bottom 2

    Bottom 3

    I want some sort of jQuery script that adds a unique number or a unique ID to each. I’ve got this basic script with the id “top1”, “top2” and so on, which slides down “below1” and “below2”. I want to generate a unique number so that you can add as many as you want.

    #95144
    philip_mcl
    Member

    If I understand you correctly, this should do the trick. Build an array containing all the divs you’re interested in generated unique IDs for then loop through them.

    $(function(){
    var divs = $('#top, #bottom');
    var totalDivs = divs.length - 1;

    var i=0;
    for (i=0;i<=totalDivs;i++)
    {
    var currentID = divs.attr('id');
    divs
    .attr('id', currentID + '-' + i );
    }
    });

    #95244
    philip_mcl
    Member

    Sorry for the delay! From a cursory glance I’d guess that when you toggle one div to slide down, you want the rest to all slide up, allowing only one div open at a time?

    An easy way to handle this might be to toggle a class of “open” or “live” when the div is opened. That way you tell all divs WITHOUT the class of “open” or “live” to slideUp.

    Example:


    $("#top1").click(function(){
    $("#bottom1").toggleClass('open').slideToggle();
    $("div:not(.open)").slideUp();
    });

    I presume you’ll have many more divs on the page beyond these toggable divs. I would highly recommend that you give ALL sliding divs a common class name which you can use to select them by.

    Say you gave all sliding divs the class of “slider”. The above would change the following code to…


    $("#top1").click(function(){
    $("#bottom1").toggleClass('open').slideToggle();
    $(".slider:not(.open)").slideUp();
    });

    I haven’t tested this code, but the logic I believe is sound and appropriate.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.