Question

I’m very new to Javascript and have a query about a script I’m using.

I’m currently displaying content based on the dropdown menu selection using the following: http://jsfiddle.net/mcgarriers/wjLXk/

However, I’d like to rejig this form so if I select the “show two” option it will display both div1 & div2 and if I select “show three” it will display all the divs.

How do I achieve this with the code in my jsfiddle?

Many thanks for any help.

Answer 1

ive had a little fiddle try this, get all the child nodes form with in your mySpecialElements and then display them based on the count , this is prolby not the most effect way. this should help get you on your way.

// display a certain element
function showElement(element) {

element.style.display = '';
 //alert(element.id )
var tee = element.id
// var gh = tee.charAt(tee.length-1);  // get the int form id will (fail if GT 9)
var gh = tee.slice(-1);

// if id GT 0 
if(gh  > 0){
   var elms = document.getElementById('mySpecialElements');

  // get all child nodes within mySpecialElements       
  for (var i = 0; i < gh ; i++) {
  // if DIV display elements by id as block
    if(elms.nodeName == "DIV"){ 
  document.getElementById(elms.childNodes[i].id).style.display = "block";
    }
   }
}

} 

BTW, you should make all you tag elements within mySpecialElements on one line, else will have issues with FF

 <div id="mySpecialElements"><div id="npup0" class="hidden">one div</div><div id="npup1"     class="hidden">second div</div><div id="npup2" class="hidden">third div</div>