JQuery二级联动下拉框+添加移除选项

1.CSS文件代码：

     $(document).ready(function() {                //绑定Connection分类
                $.ajax({
                    type: "POST",
                    contentType: "application/json",
                    url: "aaaaaaaaaa.aspx/GetConnectionTag",
                    data: "{}",
                    dataType: 'json',
                    success: function(result) {
                         var list = eval("(" + result.d + ")");
                         var option = null;
                         
                        $.each(list.ConnectionTag, function(i, n){
                           option = $("<option></option>");
                           option.attr("value", n.CONNECTION_TAG_ID);
                           option.attr("innerHTML", n.TAG_NAME_EN);
                           $("#Connection_Select1").append(option);
                        });
                        
                        $("#Connection_Select1").change();

                    },
                    error:function(x, e){
                       alert("error");  
                    }

                });

               //更改分类时的事件处理
               $("#Connection_Select1").change(function(){
                    $.ajax({
                        type: "POST",
                        contentType: "application/json",
                        url: "aaaaaaaaaa.aspx/GetConnectionUser",
                        data: "{'tag_id':" + $("#Connection_Select1").val() + "}",
                        dataType: 'json',
                        success: function(result) {

                             var list = eval("(" + result.d + ")");
                             var option = null;
                             $("#Connection_Select2").empty(); //清空所有项
                             
                            $.each(list.ConnectionUser, function(i, n){
                               option = $("<option></option>");
                               option.attr("value", n.USER_ID);
                               option.attr("innerHTML", n.USER_LOGIN_NAME);
                               $("#Connection_Select2").append(option);
                            });

                        },
                        error:function(x, e){
                           alert("error");  
                        }
                    });
               });
               //添加
               $("#btnAdd").click(function(){
                    var select2_val = $("#Connection_Select2").val();
                    if(select2_val != null){
                        $.ajax({
                            type: "POST",
                            contentType: "application/json",
                            url: "aaaaaaaaaa.aspx/GetListByUserIdString",
                            data: "{'userIdString':'" + select2_val + "'}",
                            dataType: 'json',
                            success: function(result) {
                                 var list = eval("(" + result.d + ")");
                                 var option = null;
                                 var f = null;
                                 
                                $.each(list.UserList, function(i, n){
                                   f = true;
                                   $("#Connection_Select3").find("option").each(function(){
                                        if($(this).val() == n.USER_ID){
                                            f = false;  //如果选项已存在
                                        }
                                   });
                                   
                                   if(f){
                                       option = $("<option></option>");
                                       option.attr("value", n.USER_ID);
                                       option.attr("innerHTML", n.USER_LOGIN_NAME);
                                       $("#Connection_Select3").append(option);
                                   }
                                });
                            },
                            error:function(x, e){
                               alert("error");  
                            }
                        });
                    }
               });
               //删除
               $("#btnDelete").click(function(){
                    var select3_val = $("#Connection_Select3").val();

                    if(select3_val != null){                        //object类型不能直接split，必须先转成String类型
                        var array = new String(select3_val).split(","); 
                        $.each(array, function(i){
                             $("#Connection_Select3 option[value='" + array  + "']").remove();  
                        });
                    }
               });
        });
 
2.ASPX页面代码：
 
    <table border="0" cellpadding="2" cellspacing="0">
        <tr>
            <td align="right">
                Connection分类:
            </td>
            <td>
                <select id="Connection_Select1" style="width: 211px;">
                    <option value="0"></option>
                </select>
            </td>
            <td>
            </td>
            <td>
                Connection选中的会员:
            </td>
        </tr>
        <tr>
            <td align="right" valign="top">
                Connection待选会员:
            </td>
            <td>
                <select id="Connection_Select2" multiple="multiple" class="box">
                </select>
            </td>
            <td>
                <input id="btnAdd" type="button" value="添加>>" />
                <br />
                <input id="btnDelete" type="button" value="<<删除" />
            </td>
            <td>
                <select id="Connection_Select3" multiple="multiple" class="box">
                </select>
            </td>
        </tr>
    </table>

3.ASPX.CS后台代码：
 


    #region 查询Connection Tag，Jquery调用方法    /// <summary>
    /// 查询Connection Tag，Jquery调用方法
    /// </summary>
    /// <returns></returns>
    [System.Web.Services.WebMethod]
    public static string GetConnectionTag()
    {
        DataSet ds = new ConnectionBLL.Connection_TagManager().GetList(22);
        return Shundao.Common.JsonConvert.ToJson(ds.Tables[0], "ConnectionTag");
    }
    #endregion
 
    #region 根据Connection_Tag_id查找会员，JQuery调用方法
    /// <summary>
    /// 根据Connection_Tag_id查找会员，JQuery调用方法
    /// </summary>
    /// <param name="tag_id"></param>
    /// <returns></returns>
    [System.Web.Services.WebMethod]
    public static string GetConnectionUser(object tag_id)
    {
        DataSet ds = new ConnectionBLL.ConnectionManager().GetList(22, tag_id);
        return Shundao.Common.JsonConvert.ToJson(ds.Tables[0], "ConnectionUser");
    }
    #endregion
 
    #region 根据以“,”分隔的USER_ID获取用户，JQuery调用方法
    /// <summary>
    ///  根据以“,”分隔的USER_ID获取用户，JQuery调用方法
    /// </summary>
    /// <param name="userIdString"></param>
    /// <returns></returns>
    [System.Web.Services.WebMethod]
    public static string GetListByUserIdString(string userIdString)
    {
        DataSet ds = new UserBLL.UserManager().GetListByUserIdString(userIdString);
        return Shundao.Common.JsonConvert.ToJson(ds.Tables[0], "UserList");
    }
    #endregion