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");
    }
});
附图:

jQury地区省市插件distpicker,无选择时颜色变浅jQury地区省市插件distpicker,无选择时颜色变浅