jquery的selectBoxIt控件使用

selectBoxIt控件可以用来代替简单的html5的<select>标签，使用很方便。

• html代码如下：

<script type="text/javascript">
jQuery(document).ready(function($) {
    $("#select-voyageedit").selectBoxIt();
});
</script>
<select class="form-control" id="select-voyageedit">
    <option></option>//这里加了一个空的选项，也可以删除，没什么意义
</select>

• js代码

if($("#select-voyageadd").data("selectBox-selectBoxIt").listItems.length==1)
    {
        $.ajax({
            type : "POST",
            url : "***********.action", // 请求地址，后面可以传参      
            error : function() {// 下面是前台的处理操作，自己可以按需求修改
                alert("发生错误");
                // 发生错误再请求一次
            },
            data : {
            },
            dataType : "json",
            success : function(data) {// 下面是前台的处理操作，自己可以按需求修改
                if (data != null) { 
                    $("#select-voyageadd").data("selectBox-selectBoxIt").remove();//首先清空select控件中的选项
                     $("#select-voyageadd").data("selectBox-selectBoxIt").add({ value: '0', text: '未知航次'});//添加一个未知航次的选项
                    $.each(data, function(n, value) {  
                         $("#select-voyageadd").data("selectBox-selectBoxIt").add({ value: value.voyageid, text: value.vchinese});//将获取的数据添加到select选项中
                    });
                } else {
                    alert("数据为空");
                }
            }
        });
    }