JS獲取select選中的值,所有option值


      <select name="myselect" id="myselect">
    <option value="2042">1--測試二級頁面專題</option>
    <option value="2031">2--2016年浙江省大學生藝術節</option>
    <option value="1983">3--2016里約奧運圖粹</option>

  </select>

一、JS獲取:                                                                                                              二、Jquery獲取:

  獲取select對象:var myselect = document.getElementById("myselect");                           獲取select對象:var myselectjq = $("#myselect");或者$("select[name='myselect']");

     select下所有option選項:var alloptions = myselect.options;                                                select下所有option選項:var alloptions = $("#myselect option");         

  使用console.log(alloptions);在控制台中查看結果如圖:                                                         使用console.log(alloptions);在控制台中查看結果如圖:

                                                                                                                                                                     

  展開其中任一下結果中的option,如下圖:

                                                                      

                                                                      

    從上面的圖中可以看到常用的一些屬性,通過這些屬性就可以獲取到值、選項:

    獲取選中項的索引:var selectedIndex = myselect.selectedIndex;                                          獲取選中項的索引:var selectedIndex = myselectjq.index(); 注意:此處是index()方法,若使用alloptions.index()得到的會是最后一個option的索引值:2

  獲取選中項的值(即option的value屬性值):                            獲取選中項的值(即option的value屬性值):

                var selectedvalue = myselect.options[selectedIndex].value;                                                 var selectedvalue = $("#myselect option:selected").value;

   獲取選中項的文本:                                                          獲取選中項的文本:

       var selectedtext = myselect.options[selectedIndex].text;                                                  var selectedtext = $("#myselect option:selected").text(); 注意:此處是text()方法

                var selectedtext = myselect.options[selectedIndex].innerHTML;                                         var selectedtext = $("#myselect option:selected").html(); 注意:此處是html()方法       

 

     http://www.cnblogs.com/wang7/archive/2012/10/16/2726349.html  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM