Results 1 to 4 of 4

Thread: Add a sequential number to each list item?

  1. #1
    Join Date
    Mar 2005
    Location
    Western Australia
    Posts
    148
    Thanks
    24
    Thanked 4 Times in 4 Posts

    Default Add a sequential number to each list item?

    I am wanting to add a sequential number starting at either 0 or 1 next to each list item via javascript, so if I have;

    Code:
    <ul>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    <li>Item</li>
    </ul>
    so the result is something like

    Code:
    <ul>
    <li>1 Item</li>
    <li>2 Item</li>
    <li>3 Item</li>
    <li>4 Item</li>
    <li>5 Item</li>
    </ul>
    Note however it would need to be specific to this list set so that all other lists on the page are not affected, I assume a name tag in the UL should cover that?

    Hope that makes sense and thanks guys
    1st rule of web development - use Firefox and Firebug
    2nd rule - see the first rule
    --
    I like Smilies

  2. #2
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,164
    Thanks
    265
    Thanked 690 Times in 678 Posts

    Default

    Is there then a reason not to use <ol>, ordered list? It's like <ul> but instead of "unordered", it has numbers.
    Daniel - Freelance Web Design | <?php?> | <html>| español | Deutsch | italiano | português | català | un peu de français | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum

  3. #3
    Join Date
    Mar 2005
    Location
    Western Australia
    Posts
    148
    Thanks
    24
    Thanked 4 Times in 4 Posts

    Default

    Yes I have my reasons not to use OL, the number will be added to a class as well
    1st rule of web development - use Firefox and Firebug
    2nd rule - see the first rule
    --
    I like Smilies

  4. #4
    Join Date
    Mar 2005
    Location
    Western Australia
    Posts
    148
    Thanks
    24
    Thanked 4 Times in 4 Posts

    Default

    I have been trying to get my head around javascript increments, in particular I have been reading the info at http://www.webdevelopersnotes.com/tu...operators.php3

    namely from the example

    Code:
    var a = 5;
       b = a++;
    	(b contains the initial value of a, which is 5.
    	a, on the other hand is now equal to 6)
    
       var a = 5;
       c = ++a;
    	(In this case, JavaScript first adds 1 to a, changing
    	its value to 6. This value is returned to c.
    	Thus, c = 6)
    But how do I get it to increment, so from the above (first part) if I call 'a' I get 6, which is fine, but if a is called again it is still 6 and not 7... how do I get a to be 6, 7 , 8 and so on?

    Likewise in the second part, where c is returned as 6, how do I get it to return as 7 on the next call on the same list?

    I am trying to learn...

    Here is a sample of what I am trying to get to work

    Code:
    ...this.classActive="dgst_active"+dgsx;this.classInActive="dgst_inactive"+dgsx;...
    where 'dgsx' is the same as 'a' in the above example.

    But all I get is the class all having the same number at the end instead of it incrementing
    Last edited by gwmbox; 05-26-2010 at 09:41 AM. Reason: more info
    1st rule of web development - use Firefox and Firebug
    2nd rule - see the first rule
    --
    I like Smilies

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •