Javascript获取select下拉框选中的的值,select中指定option选中触发事件

1、需求描述

当标识选中为“班”时，将选中的标记颜色，标识栏使用了多个select下拉框

2、页面效果

3、

页面

 <tr>
   <td>日期</td>
     <td style="width: 20px;" v-for="item in weeksData" :key="item.date">{{item.date}}</td>
   </tr>
   <tr>
     <td>星期</td>
     <td v-for="(item,index) in weeksData" :class="(item.week=='周六'||item.week=='周日')?'lightColor':'blue'" :key="index">{{item.week}}</td>
   </tr>
   <tr>
     <td>标示</td>
     <td v-for="(item,index) in weeksData" :key="index">
       <select :id="'selec'+item.date" :name="item.date" :data-week="item.week" class="classMarkSel" @change="a($event,index,item.date)" >
         <option v-for="(itemflag,indexflag) in listClassMarksData" :key="indexflag"
                 :value="itemflag.dictCode" :class="itemflag.dictCode == '20' ?'lightColor':'blue'" >
           {{itemflag.dictContent}} 
         </option>
       </select>
     </td>
   </tr>

methods中方法

a(event, index,selDate,dictCodem) {
 var myselect=document.getElementById("selec"+selDate);
  var index=myselect.selectedIndex ; // selectedIndex代表的是你所选中项的index
  if(myselect.options[index].text == '班'){
     var geth1 = document.getElementById("selec"+selDate);
     geth1.style.background="#CCFFFF"
   }
 }

一、 javascript原生方法

1、拿到select对象： var myselect = document.getElementById('ID');
2、拿到选中的索引： var index=myselect.selectedIndex ;  // selectedIndex代表的是你所选中项的index
3、拿到选中的option的value： myselect.options[index].value;
4、拿到选中项options的text： myselect.options[index].text;

二、 jQuery 方法

1、var options = $("#ID option:selected");//获取选中的值
2、options.val();  //选中的值
3、options.text(); //选中的文本