SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Jul 2010
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Javascript Toggle

    How we can modify this function in order to make it in use for many displays?
    HTML Code:
    script type="text/javascript">
    <!--
        function toggle_visibility(id) {
           var e = document.getElementById(id);
           if(e.style.display == 'block')
              e.style.display = 'none';
           else
              e.style.display = 'block';
        }
    //-->
    </script>
    for example! I have this code, the select with id=one is the main one whatever I select from the drop down list One or two or three , the other menue appear" with id=two or id=three
    HTML Code:
    <select id="one" onChange="hide_show('three', this);">
      <option value="1">One</option>
      <option value="2">Two</option>
      <option value="3">Three</option>
    </select>
    <select id="two" style="display: none;">
      <option value="1">One</option>
      <option value="2">Two</option>
      <option value="3">Three</option>
    </select>
    <select id="three" style="display: none;">
      <option value="1">One</option>
      <option value="2">Two</option>
      <option value="3">Three</option>
      </select>
    
    <

  2. #2
    SitePoint Evangelist TommiChi's Avatar
    Join Date
    Oct 2008
    Posts
    440
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You could try this:
    Pass an array of id's in the function parameter, and use a for loop to loop through the array and execute your code
    function toggle_visibility(id) {
    for(i = 0; i < id.length; i++) {
    var e = document.getElementById(id[i]);
    if(e.style.display == 'block') {
    e.style.display = 'none';
    }
    else {
    e.style.display = 'block';
    }
    }
    }


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
  •