• jquery去重复 如何去除select控件重复的option


    #1.去除select控件重复的option

    <select id="companyId" onchange="getContract()" name="company"
                   class="form-control m-bot15" placeholder="请选择" style=" 200px;">
                    <option value="">请选择</option>
     </select>

    /* 填充用户单位名称 */
        function getCompany() {
            $.ajax({
                        url : "findCompany.json",
                        type : "POST",
                        success : function(data) {
                            var Str = JSON.stringify(data);
                            alert(Str + "------返回结果-------");
                            for (var i = 0; i < data.businessDeployList.length; i++) {
                                var option = document.createElement("option");
                                var obj = data.businessDeployList[i].company;
                                $(option).val(obj);
                                $(option).text(obj);
                                $('#companyId').append(option);

            /* 去除重复的option值 */
                                if ($("#companyId option:contains(" + obj + ")").length > 1) {
                                    console.log(obj);
                                    $("#companyId option:contains(" + obj+ "):gt(0)").remove();
                                }
                            }
                        },
                    });
            };

    参考链接:http://blog.csdn.net/u012767607/article/details/61927808

    ---------------------------------------------------------------------------------------------------------------------------------------------

    #2.ajax返回数据作为全局变量,自动填充数据

    /* 动态填充用户单位名称 */
        var result;   //定义全局变量
        function getCompany() {
            $.ajax({
                        url : "findCompany.json",
                        type : "POST",
                        async : false,
                        success : function(data) {
                            /*  var Str = JSON.stringify(data);
                            alert(Str + "------查看返回结果-------");  */
                            result=data;
                            for (var i = 0; i < data.businessDeployList.length; i++) {
                                var option = document.createElement("option");
                                var obj = data.businessDeployList[i].company;
                                $(option).val(obj);
                                $(option).text(obj);
                                $('#companyId').append(option);
                                if ($("#companyId option:contains(" + obj + ")").length > 1) {
                                    console.log(obj);
                                    $("#companyId option:contains(" + obj+ "):gt(0)").remove();
                                }
                            }
                        },
                    });
            };
                
            /* 根据单位名称自动填充合同名称 */
               function getContract(r){
                var   name=$("#companyId").find("option:selected").val();
                $("#contractId").empty();
                for(var i=0;i < result.businessDeployList.length; i++){
                  if(name==result.businessDeployList[i].company){
                    var contract=result.businessDeployList[i].contract;
                    var option = document.createElement("option");
                    $(option).val(contract);
                    $(option).text(contract);
                    $('#contractId').append(option);
                    }  
                }
            }  

  • 相关阅读:
    敏捷开发 之 计划、测试 与 重构
    敏捷开发 之 理论概述篇
    第二十章 排查和调试Web程序 之 设计异常处理策略
    第十九章 排查和调试Web程序 之 防止和排查运行时问题
    第十八章 提升用户体验 之 减少带宽占用
    第十七章 提升用户体验 之 使用MVC扩展功能控制程序行为
    第十六章 提升用户体验 之 设计实现routes
    第十五章 提升用户体验 之 设计实现MVC controllers 和 actions
    第十四章 提升用户体验 之 设计实现国际化和本地化
    Nginx系统学习笔记(3)同一端口下设置Alias(虚拟目录)
  • 原文地址:https://www.cnblogs.com/Steven5007/p/8023100.html
Copyright © 2020-2023  润新知