原生select,鼠标悬浮在option,改变鼠标的样式
其他问答
1
有这么一个下拉选择框,我把第二项做了动态禁止,但是我想实现:鼠标悬浮在禁止的那项option,改变鼠标的样式,我加了行内样式,不管用。
<select v-model="selectType1" class="Y45_bb31_313f51e form-control" >
<option value="ID"></option>
<option value="PASSPORT" :disabled="userRights ==='HKID'"></option>
</select>
-
系统生成的下拉option,无法更改。可以用第三方的控件来模拟select,这样可以控制,比如select2。简单示例如下。不过题主用到了vue,需要注意添加
<link href="http://select2.github.io/select2/select2-3.5.3/select2.css" type="text/css" rel="stylesheet" /> <style> /*重写不允许选择的模拟容器curor样式*/ .select2-disabled div{cursor:not-allowed!important} </style> <select v-model="selectType1" class="Gd3_943e_3e06661 form-control" id="sel"> <option value="PASSPORT" disabled>1111</option> <option value="2222">2222</option> <option value="3334">3334</option> </select> <script src="http://select2.github.io/select2/js/jquery-1.7.1.min.js"></script> <script src="http://select2.github.io/select2/select2-3.5.3/select2.js"></script> <script> $("select").on('select2-selecting', (e) => { alert(e.val);//要用到this.selectType1=e.value更新model }).select2(); </script>
发表回复