bulidfer
2018-08-06 17:00
采纳率: 35.3%
浏览 2.3k
已采纳

jquery如何删除name属性相同的select 重复的option值 并保留选中的项

图片说明

第一个select选中项目:  心、食道;
 <select name="xuewei_id" class="form-control input-sm downList2" multiple>
<option value="1" selected='selected'>心</option>
<option value="1" >心</option>
<option value="2" >肺</option>
<option value="2" >肺</option>
<option value="3" >气管</option>
<option value="3" >气管</option>
<option value="4" >口</option>
<option value="4" >口</option>
<option value="5" >食道</option>
<option value="5" selected='selected'>食道</option>
<option value="6" >贲门</option>
<option value="6" >贲门</option>
<option value="7" >胃</option>
<option value="7" >胃</option>
<option value="8" >脾</option>
<option value="8" >脾</option>
<option value="9" >脑干</option>
<option value="9" >脑干</option>
<option value="10" >内分泌</option>
<option value="10" >内分泌</option>
</select>

//第二个select  选中项目: 心
<select name="xuewei_id" class="form-control input-sm downList2" multiple>
<option value="1" selected='selected'>心</option>
<option value="1" >心</option>
<option value="2" >肺</option>
<option value="2" >肺</option>
<option value="3" >气管</option>
<option value="3" >气管</option>
<option value="4" >口</option>
<option value="4" >口</option>
<option value="5" >食道</option>
<option value="5" >食道</option>
<option value="6" >贲门</option>
<option value="6" >贲门</option>
<option value="7" >胃</option>
<option value="7" >胃</option>
<option value="8" >脾</option>
<option value="8" >脾</option>
<option value="9" >脑干</option>
<option value="9" >脑干</option>
<option value="10" >内分泌</option>
<option value="10" >内分泌</option>
</select>
  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

12条回答 默认 最新

  • 猫猫绒 2018-08-07 08:20
    已采纳

    对于select下的option,最好的option数据是页面加载后获取到数据,再将数据append到select下,这是比较标准的做法,所以html中的select下是空的。你的这个代码里就是一串的option么??两个解决办法。一,在select被触发时,对内部的option选项进行整理去重,在放到select内。二,把option数据放在后台或者数据库,请求后整理去重,在append。

    已采纳该答案
    评论
    解决 无用
    打赏 举报
  • mythos55 2018-08-07 00:30

    加载option的时候去重或者让后端做

    评论
    解决 无用
    打赏 举报
  • _zming 2018-08-07 01:12

    记住:去重尽量在渲染前做

     <select id="s"/>
    var map = {};
    $("#s").find("option").each(function(){
        var $this = $(ths);
        var v = $this.attr("value");
        if (map[v] ) {
            if (!this.is(":selected") )$this.remove();
        }  else {
            map[v] = true;
        }
    });
    
    评论
    解决 无用
    打赏 举报
  • 张音乐 2018-08-07 01:38

    你name设置成不一样的不行吗?为什么要把name设置成一样的?

    评论
    解决 无用
    打赏 举报
  • bulidfer 2018-08-07 02:37

    图片说明

    评论
    解决 无用
    打赏 举报
  • bulidfer 2018-08-07 03:04

    this 如何写 判读 当前option为选中
    图片说明

    评论
    解决 无用
    打赏 举报
  • bulidfer 2018-08-07 03:05

    图片说明

    评论
    解决 无用
    打赏 举报
  • 于海航 2018-08-07 03:37

    可以在渲染前对数据过滤的,去掉重复,能看一下你是怎么把数据添加进去的吗

    评论
    解决 无用
    打赏 举报
  • bulidfer 2018-08-07 07:02
     // 添加行 频扫组合表信息
    function addRow1() {
        var str = "";
        str += "<tr>";
        str += "<td colspan=\"8\">";
        str += "<div style=\"margin-left: 148px;\" id=\"earScanCp\">";
        str += "<div style=\"float: left;\">";
        str += "<textarea style=\"width: 50px;margin-left: -86px;position: absolute;\" id=\"cp_id\" name=\"cp_id\" ></textarea>";
        str += "<select style=\"width: 60px;height: 36px;margin-left: 20px;\" id=\"gender\" name=\"gender\" >"
        var myselect = document.getElementById("gender");// 这个获取的是静态jsp页面里标签
        for (var j = 0; j < myselect.options.length; j++) {// 下拉框是主家从静态页面获取并且遍历它
            str += "<option value=\"" + myselect.options[j].value + "\">"
                    + myselect.options[j].text + "</option>";
        }
        "</select>";
        str += "<textarea style=\"width: 50px;margin-left: 10px;\" id=\"min_age\" name=\"min_age\" ></textarea>";
        str += "<textarea style=\"width: 50px;margin-left: 10px;\" id=\"max_age\" name=\"max_age\" ></textarea>";
        // str += "<textarea style=\"width: 300px;margin-left: 10px;\"
        // id=\"xuewei_id\" name=\"xuewei_id\" ></textarea>";
        /* select2标签开始 */
    /*  str += "<textarea  style=\"width:300px;margin-left:10px;display:none;\" id=\"strXueweiId\" name=\"strXueweiId\" ></textarea>";
        str += "<select style=\"width: 300px;margin-left:10px;\"name=\"xuewei_id\" class=\"combox\" multiple >"
        str += "<optgroup label=\"小辈儿组\">";
        str += "<option value=\"1\">心</option>";
        str += "<option value=\"2\">" + "肺" + "</option>";
        str += "<option value=\"3\">" + "小肠" + "</option>";
        str += "<option value=\"4\">" + "口" + "</option>";
        str += "<option value=\"5\">" + "食道" + "</option>";
        str += "</optgroup>";
        "</select>";*/
    
        str += "<textarea  style=\"width:300px;margin-left:10px;display:none;\" id=\"strXueweiId\" name=\"strXueweiId\" ></textarea>";
        str += "<select name=\"xuewei_id\" class=\"form-control input-sm downList2\" multiple>";
        str += "<option></option>";
    
           "</select>";
    
    
    
    
    
    
    
    
        str += "<textarea style=\"width: 220px;margin-left: 10px;\" id=\"chuzhen_id\" name=\"chuzhen_id\" ></textarea>";
        str += "<select style=\"width: 60px;height: 36px;margin-left: 10px;\" id=\"bp\" name=\"bp\" >"
        var myselect1 = document.getElementById("bp");// 这个获取的是静态jsp页面里标签
        for (var k = 0; k < myselect1.options.length; k++) {// 下拉框是主家从静态页面获取并且遍历它
            // alert("j值:" + myselect1.options[k].value);
            // alert("text值:" + myselect1.options[k].text);
            str += "<option value=\"" + myselect1.options[k].value + "\">"
                    + myselect1.options[k].text + "</option>";
        }
        "</select>";
        str += "<textarea style=\"width: 50px; height: 36px;margin-left: 10px;\" id=\"jielun_conform\" name=\"jielun_conform\"></textarea>";
        str += "</div>";
        str += "<div >";
        str += " <input type=\"button\" onclick=\"delRow(this)\" value=\"删除\" id=\"deleteESC\" name=\"deleteESC\" style=\"float: left; margin-left:10px; margin-top: 5px;\">";
        str += "</div>";
        str += "</div>";
        str += "</td>";
        str += "</tr>";
        $("#rowTable1").append(str);
        // $("select[name='xuewei_id']").select2({
        // $("#xuewei_id").select2().trigger();
        // $("#xuewei_id").trigger('change')
        select2Execute();
    }
    
    评论
    解决 无用
    打赏 举报
  • wildss 2018-08-07 08:20

    把完整代码贴一下,我帮你看看

    评论
    解决 无用
    打赏 举报
  • bulidfer 2018-08-07 09:13

    完整代码:

    js代码

     // 显示修改关键字症状界面
    function updateView(id, system_id) {
        $("#btntype").val(1);
    
        $("#Submit1").click(function() {
            select2Execute();
            add(1);
    
        });
    
        $
                .ajax({
                    type : "POST",
                    url : "/erzhentang/manage/forAjax.do?requestType=12.1",
                    data : "id=" + id + "&system_id=" + system_id, // 发送到服务器的数据默认id是结论id
                    success : function(msg) {
                        // $("#xuewei_id").val("1,2,3").select2();
                        /* alert(msg); */
                        var json = eval('(' + msg + ')');
                        document.getElementById("addModel").style.display = "block";
                        document.getElementById("id1").value = json.earScanJielun.id;
                        document.getElementById("system_id1").value = json.earScanJielun.system_id;
                        /* 遍历所属系统下所有 耳穴频扫疾病项 */
                        var arrESJ = eval(json.listEarScanJibing);// arrESJ是一个数组
                        var checkESJ = document.getElementById("jibing_num1");
                        var str2 = "";
                        for (var j = 0; j < arrESJ.length; j++) {
                            str2 += "<option value=\"" + arrESJ[j].jibing_num
                                    + "\">" + arrESJ[j].name + "</option>";
                            var checkESJ2 = arrESJ[j].name;
                            if (arrESJ[j].jibing_num == json.earScanJielun.jibing_num) {// 疾病编号人为控制每个编号都是唯一
                                arrESJ[j].name = "selected='selected'";
                            }
                            $("#jibing_num1").html(str2);
                        }
                        document.getElementById("jibing_num1").value = json.earScanJielun.jibing_num;
                        document.getElementById("jielun_rank1").value = json.earScanJielun.jielun_rank;
                        document.getElementById("jielun1").value = json.earScanJielun.jielun;
                        /* 下半截部分组合表动态展示修改和添加 */
                        var arrESC = eval(json.listEarScanCp);// arrESC是一个数组频扫结论组合表
                        var arrESA = eval(json.listEarScanAcupoint);// arrESA是一个科研穴位信息
                        var str = "";
                        var str1 = "";
                        for (var i = 0; i < arrESC.length; i++) {
                            str += "<tr>";
                            str += "<td colspan=\"8\">";
                            str += "<div style=\"margin-left: 148px;\" id=\"earScanCp\">";
                            str += "<div style=\"float: left;\">";
                            str += "<textarea style=\"width: 50px;margin-left: -86px;position: absolute;\" id=\"cp_id\" name=\"cp_id\" >"
                                    + arrESC[i].id + "</textarea>";
                            str += "<select style=\"width: 60px;height: 36px;margin-left: 20px;\" id=\"gender\" name=\"gender\" >"
                            var myselect = document.getElementById("gender");// 这个获取的是静态jsp页面里标签
                            /*
                             * 下拉框主要是应展示项和所有下拉选项的值判断是否对应 分清主和客
                             * 所有展示项目为主表客表的某一项值和遍历主表的值对应 这里面 下拉框所有选项值是主表
                             */
                            var str1 = "";
                            for (var j = 0; j < myselect.options.length; j++) {// 下拉框是主家从静态页面获取并且遍历它
                                // alert("j值:" + myselect.options[j].value);
                                str += "<option value=\""
                                        + myselect.options[j].value
                                        + "\" "
                                        + (myselect.options[j].value == arrESC[i].gender ? "selected='selected'"
                                                : "") + ">"
                                        + myselect.options[j].text + "</option>";
                            }
                            "</select>";
                            str += "<textarea style=\"width: 50px;margin-left: 10px;\" id=\"min_age\" name=\"min_age\" >"
                                    + arrESC[i].min_age + "</textarea>";
                            str += "<textarea style=\"width: 50px;margin-left: 10px;\" id=\"max_age\" name=\"max_age\" >"
                                    + arrESC[i].max_age + "</textarea>";
    
                            /* select2标签开始 */
                            str += "<textarea  style=\"width:300px;margin-left:10px;display:none;\" id=\"strXueweiId\" name=\"strXueweiId\" >"
                                    + arrESC[i].xuewei_id + "</textarea>";
    
    
    
    
                            str += "<select name=\"xuewei_id\" class=\"form-control input-sm downList2\" multiple>";
    
                            alert("arrESA.length值:" + arrESA.length);
                            // 将arrESC[i].xuewei_id分割成一个数组
                            var arrXueweId = arrESC[i].xuewei_id.split(",");
                            alert("arrXueweId:"+arrXueweId)
                            for (var j = 0; j < arrESA.length; j++) {// 下拉框是主家从静态页面获取并且遍历它
                                for (var k = 0; k < arrXueweId.length; k++) {
                                    str += "<option value=\""
                                        + arrESA[j].id
                                        + "\" "
                                        + (arrESA[j].id == arrXueweId[k] ? "selected='selected'"
                                                : "") + ">" + arrESA[j].text
                                        + "</option>";
                                }
    
                            }
                            "</select>";
    
                        /*  var map = {};
                            $(".downList2").find("option").each(function(){
                                var $this = $(ths);
                                var v = $this.attr("value");
                                if (map[v] ) {
                                    if (!this.is(":selected") )$this.remove();
                                }  else {
                                    map[v] = true;
                                }
    
                                var text = $(this).text();
                                alert("text"+text);
                                if (!$(this).is(":selected") )$this.remove();
    
    
    
                            });*/
                            str += "<textarea style=\"width: 220px;margin-left: 10px;\" id=\"chuzhen_id\" name=\"chuzhen_id\" >"
                                    + arrESC[i].chuzhen_id + "</textarea>";
                            str += "<select style=\"width: 60px;height: 36px;margin-left: 10px;\" id=\"bp\" name=\"bp\" >"
                            var myselect1 = document.getElementById("bp");// 这个获取的是静态jsp页面里标签
                            for (var k = 0; k < myselect1.options.length; k++) {// 下拉框是主家从静态页面获取并且遍历它
                                // alert("j值:" + myselect1.options[k].value);
                                str += "<option value=\""
                                        + myselect1.options[k].value
                                        + "\" "
                                        + (myselect1.options[k].value == arrESC[i].bp ? "selected='selected'"
                                                : "") + ">"
                                        + myselect1.options[k].text + "</option>";
                            }
                            "</select>";
                            str += "<textarea style=\"width: 50px; height: 36px;margin-left: 10px;margin-top: 0px;\" id=\"jielun_conform\" name=\"jielun_conform\">"
                                    + arrESC[i].jielun_conform + "</textarea>";
                            str += "</div>";
                            str += "<div >";
                            str += " <input type=\"button\" onclick=\"delRow(this,"
                                    + arrESC[i].id
                                    + ","
                                    + arrESC[i].bianzhengId
                                    + ")\" value=\"删除\" id=\"deleteESC\" name=\"deleteESC\" style=\"float: left; margin-left:10px; margin-top: 5px;\">";
                            str += "</div>";
                            str += "</div>";
                            str += "</td>";
                            str += "</tr>";
                            /* 替换静态页面 */
                            $("#tbody1").html(str);
    
                        }
                        select2Execute();
    
                    }
                });
    }
    
     /* 执行select2方法初始化 */
    function select2Execute() {
        /*去重option*/
    /*  $("select[name='xuewei_id'] option").each(function() { 
        var text = $(this).text();
        alert("text"+text);
        if($("select[name='xuewei_id'] option:contains("+text+")").length > 1)   作用:select option:contains("+text+")")包含text的个数 
        {
    //      if (!$("select[name='xuewei_id'] option").is(":selected") ){$("select[name='xuewei_id'] option:contains("+text+"):gt(0)").remove();}
    //      if (!this.contains(":selected") ){$("select[name='xuewei_id'] option:contains("+text+"):gt(0)").remove();}
           作用:包含text大于个数0的选项就移除
    
            if($("select[name='xuewei_id'] option:contains("+text+")").length > 1){
                if (!this.is(":selected") ){
                    $("select[name='xuewei_id'] option:contains("+text+"):gt(0)").remove();
                }
    
            }
    
    
        }
        });*/
        $("[name=xuewei_id]").each(function() {
        $(".downList2").find("option").each(function(){
    
                var text = $(this).text();
    //          alert("text"+text);
                if($("select[name='xuewei_id'] option:contains("+text+")").length > 1){
                    if (!$(this).is(":selected") )
    //              $("select[name='xuewei_id'] option:contains("+text+"):gt(0)").remove();
                    $(this).remove();
    
            });
        });
    
    
    
    
        $(function() {
            /* 1-本地注入方式 */
    
            $(".downList2").select2({
                // $("select[name='xuewei_id']").select2({
                // $('select[id="xuewei_id"]').select2({
                // $('#xuewei_id').select2({
    
                placeholder : "请至少选择一个人名",
                tags : true,
                createTag : function(decorated, params) {
                    return null;
                },
                width : '256px',
    
            });
    
            function formatState(state) {
                if (!state.id) {
                    return state.text;
                }
                var $state = $('<span>' + state.text + '</span>');
                return $state;
            }
            ;
    
            $('#sel_recommender').select2({
                placeholder : "请选择一个人名",
                templateResult : formatState,
                width : '256px'
            });
    
            // 通过id获取select2的text值,这里的text值可能有空格,需注意
            function getSelect2Text(obj) {
                var select2Obj = $("select[name='xuewei_id']").select2();
                return select2Obj.find("option:selected").text();
            }
    
            /* 获取每一个name对应的值 */
            var strXueweiId = "";
            $("[name=xuewei_id]").each(function() {
                alert("this值:" + $(this).val());
                /* 拼接每一项name的值 组合成和其它项目类似 gender那样的数组 */
                strXueweiId += $(this).val() + "-";
    
            });
            alert("strXueweiId:" + strXueweiId)
            $("#strXueweiId").val(strXueweiId)
    
    
    
    
    
    
        });
    }
    

    后台代码:

    修改数据
     String strXueweiId = request.getParameter("strXueweiId");// 获取的穴位id字符串
                String[] arryXueweiId = strXueweiId.split("-");
                System.out.println(arryXueweiId);
    
    后台查询代码
     if ("12.1".equals(requestType)) {// 根据结论id 和耳穴系统信息查询对应的耳穴频扫结论详细信息
                                                // 和系统对应的所有疾病项信息
                String jielun_id = request.getParameter("id") == null ? "" : request.getParameter("id");// 耳穴频扫结论的id
                String system_id = request.getParameter("system_id") == null ? "" : request.getParameter("system_id");// 耳穴频扫系统id
                int jielun_id1 = Integer.parseInt(jielun_id);
                int system_id1 = Integer.parseInt(system_id);
                Map<String, Object> result = new HashMap<String, Object>();
                EarScanJielun earScanJielun = earDetectionService.findEarScanJielunById(jielun_id1);
                Map<String, Object> map = new HashMap<String, Object>();
                map.put("system_id", system_id1);
                List<EarScanJibing> listEarScanJibing = earDetectionService.findAllEarScanJibing(map);// 查询所有的耳穴频扫疾病
                List<EarScanCp> listEarScanCp = earDetectionService.findEarScanCpByJielunId(jielun_id1);
                List<EarScanAcupoint> listEarScanAcupoint = earDetectionService.findAllEarScanAcupoint(map);
                JSONArray ja = new JSONArray();
                JSONObject jo = new JSONObject();
                for (int i = 0; i < listEarScanAcupoint.size(); i++) {
                    JSONObject jo1 = new JSONObject();
                    jo1.put("id", listEarScanAcupoint.get(i).getId());
                    jo1.put("text", listEarScanAcupoint.get(i).getName());
                    ja.add(jo1);
    
                }
    
                result.put("listEarScanAcupoint", ja);
                result.put("earScanJielun", earScanJielun);
                result.put("listEarScanJibing", listEarScanJibing);
                result.put("listEarScanCp", listEarScanCp);
                // result.put("listHDA", listHDA);
    
                OutputUtil.outPutJsonObject(response, result);
            }
    
    评论
    解决 无用
    打赏 举报
  • bulidfer 2018-08-07 10:36

    图片说明

    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题