select下拉框默认option为灰色,选中option颜色为白色
代码如下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script> <style> div { background: #0b2b5f; height: 800px; } select { width: 250px; height: 36px; margin: 10px 0 0 10px; padding-left: 10px; border: none; box-shadow: 0px 0px 10px #005efe inset; background: #122742; color: #fff; } </style> </head> <body> <div> <select class="select"> <option>请选择</option> <option value="11111">11111</option> <option value="22222">22222</option> <option value="33333">33333</option> </select> </div> </body> <script> $(function() { var unSelected = "#999"; var selected = "#fff"; $("select").css("color", unSelected); $("option").css("color", selected); $("select").change(function() { var selItem = $(this).val(); if(selItem == $(this).find('option:first').val()) { $(this).css("color", unSelected); } else { $(this).css("color", selected); } }); }); </script> </html>