jquery select option 多种颜色

_小女子_ 2014-03-06

展开全文

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title> Moblie </title>
<script src="http://lib.sinaapp.com/js/jquery/2.0.3/jquery-2.0.3.min.js"></script>
<script>
   $(function(){
       $(document).on("change",".colorNodeList",function(){
           var _this = $(this);
           if($(this).find("option:selected").hasClass("redColorOption"))
           {
               $(".colorNodeList").css("color","red");
           }
           else
           {
                   $(".colorNodeList").css("color","black");
           }
       });
   });
</script>
<style>
   .colorNodeList{
       color:red;
   }
   .colorNodeList>option{
       color:black;
   }
   .redColorOption{
       color:red !important;
   }
</style>
</head>

<body>
<select class="colorNodeList">
   <option class="redColorOption" value=0>aaaaa</option>
       <option value=1>bbbbb</option>
           <option class="redColorOption" value=2>ccccc</option>
               <option value=3>ddddd</option>
                   <option value=4>eeeee</option>
                       <option class="redColorOption" value=5>fffff</option>
                           <option value=6>ggggg</option>
</select>
</body>
</html>