jQury地区省市插件distpicker,无选择时颜色变浅
distpicker插件使用
1.引入js
<script src="../../resources/plugins/jquery/jquery-1.9.1.min.js"></script> <script src="../../resources/js/common/distpicker.data.min.js"></script> <script src="../../resources/js/common/distpicker.min.js"></script>2.绑定id
<div class="distpicker" data-toggle="distpicker" id="distpicker"> <select style="width: 39%" data-province="---- 省 ----" class="select-width" id="province_pro"></select> <select style="width: 40%" data-city="---- 市 ----" class="select-width" id="city_pro"></select> </div>3.设置颜色
function checkNull(val) { //非空校验 if (val == null || "" == $.trim(val)||undefined==val) return true; return false; } $("#distpicker").on("change","select",function(){ if(checkNull($(this).val())){ $(this).addClass("gray"); }else{ $(this).removeClass("blue"); } if(checkNull($("#province_pro").val())){ $("#province_pro").addClass("gray"); }else{ $("#province_pro").removeClass("gray"); } if(checkNull($("#city_pro").val())){ $("#city_pro").addClass("gray"); }else{ $("#city_pro").removeClass("gray"); } });附图: