在選項標記中調用不同功能

Question

我在選擇標記中有3個選項。當我選擇它們時，我需要調用3個不同的函數。我該怎麼做？

`  <select> 
      <option selected disabled="">Sort</option> 
      <option>Ascending</option> 
      <option>Descending</option> 
      <option>Basic JSON</option>  
     </select>` 

3函數名稱：sortArrAcc（），sortArrDec（），負載（）

所以如果我選擇升序那麼它應該排序阿拉調用CC（）等。 沒有JQuery。

Answer 1

你可以做到以下幾點： 考慮，您對以下下拉菜單：

  <select name="mselect" id="mselect"> 
       <option value="">Select</option> 
       <option value="1">Ascending</option> 
       <option value="2">Descending</option> 
       <option value="3">Basic JSON</option> 
     </select> 

這裏是JavaScript：

 var sortArrAcc = function() { 
      // invoke sort array cc and do your necessary work 
      console.log('sortArrAcc'); 
     }; 
     var sortArrDec = function() { 
      // invoke sort array cc and do your necessary work 
      console.log('sortArrDec'); 
     }; 
     var load = function() { 
      // do your necessary work 
      console.log('load'); 
     }; 

     var funcArray = [sortArrAcc, sortArrDec, load]; 

     window.addEventListener('load', function() { 
      document.getElementById('mselect').addEventListener('change', function (e) { 
       var elem = e.target; 
       var selectedOption = elem.options[elem.selectedIndex]; 
       if (selectedOption.value && funcArray[+selectedOption.value]) { 
        funcArray[+selectedOption.value](); 
       } 
      }); 
     });