JS如何获取下拉框Select的选中值--直接附上代码（小白适用)

JS如何获取下拉框的选中值

   方法一：

<label class="col-sm-2 control-label request_label" >下拉框:</label>
<select  class="form-control"; id= "selectTest";>
    <option>A</option>
    <option>B</option>
    <option>C</option>
    <option>D</option>
</select>
<script>
  $(function(){
     var select = document.getElementById("selectTest");
      select.onchange = function(){
      console.log(this.value)
     }
  }) 
</script>
   					
   			

   但是这种方法需要注意的是，只有当select下拉框发生改变的时候才会触发，默认第一次进页面，没有选中下拉框的时候是不会出发的，因此，我就结合了第二种方法：

<label class="col-sm-2 control-label request_label" >下拉框:</label>
<select  class="form-control"; id= "selectTest";>
    <option>A</option>
    <option>B</option>
    <option>C</option>
    <option>D</option>
</select>
<script>
  $(function(){
    var option = $("#selectTest option:selected") //获取选中的项
    console.log(option.val())//打印选中项的值
    console.log(option.text()) //打印选中项的文本
  });
</script>
   			

   这种方法的弊端是，只有进来的时候才会加载，且只会触发一次，这样的话当用户再选中的时候，仍然获取不到值，所以我通常是将两种方法结合起来使用，先获取其默认选中的值，如果用户改变，在根据onchage去获取，如果有更好的方法欢迎各位留言。