jQuery select默认字体灰色,选中黑色

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title></title>
 6         <script src="../jquery/jquery.js"></script>
 7     </head>
 8     <body>
 9         <div class="add-text">
10             <div class="sel-list">
11                 <select class="sele-style">  
12                     <option value ="1">请选择省份</option>  
13                     <option value ="2">北京</option>  
14                     <option value="3">天津</option>  
15                     <option value="4">上海</option>  
16                 </select>
17             </div>
18             <div class="sel-list">
19                 <select class="sele-style">  
20                     <option value ="1">请选择市</option>  
21                     <option value ="2">北京</option>  
22                     <option value="3">天津</option>  
23                     <option value="4">上海</option>  
24                 </select>
25             </div>
26             <div class="sel-list">
27                 <select class="sele-style">  
28                     <option value ="1">请选择区县</option>  
29                     <option value ="2">北京</option>  
30                     <option value="3">天津</option>  
31                     <option value="4">上海</option>  
32                 </select>
33             </div>
34         </div>
35         <script type="text/javascript">
36             var unSelected = "#999";
37             var selected = "#333";
38             $(function () {
39                 $("select").css("color", unSelected);
40                 $("option").css("color", selected);
41                 $("select").change(function () {
42                     var selItem = $(this).val();
43                     if (selItem == $(this).find('option:first').val()) {
44                         $(this).css("color", unSelected);
45                     } else {
46                         $(this).css("color", selected);
47                     }
48                 });
49             })
50         </script>
51     </body>
52 </html>

 

posted @ 2017-08-21 14:15  wǒの湁茡潞釦﹌  阅读(1584)  评论(0编辑  收藏  举报