<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>测试-当前元素不可选</title>
<style>
    .ipt {
        border: 1px solid #ddd;
        box-shadow: 0 0 3px rgba(0, 0, 0, 0.17) inset;
        transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
        border-radius: 0 !important;
        -moz-border-radius: 0 !important;
        -webkit-border-radius: 0 !important;
        height: 34px;
        padding: 0px 5px;
        line-height: 30px\9;
    }
</style>
</head>
<body>
<div>
    description：选择的时候，如果已经选择了1，则下一个下拉框就不能选择1的选项，以此类推。
</div>
<select class="ipt sortList">
    <option value="0">请选择</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

<select class="ipt sortList">
    <option value="0">请选择</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

<select class="ipt sortList">
    <option value="0">请选择</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

<select class="ipt sortList">
    <option value="0">请选择</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

<select class="ipt sortList">
    <option value="0">请选择</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>

<script src="//cdn.bootcss.com/jquery/2.2.3/jquery.js"></script>
<script>
    var _this='';
    $(".sortList").on({
        click:function(){
            _this=$(this).find("option:selected").val();
            console.log("_beforeChangethis:"+_this);
        },
        change:function(){
            console.log("_changeThis:"+_this);
            chageSort()
        }
    })

    function chageSort(){
        var sortList=$(".sortList");
        for(var i=0;i<sortList.length;i++){
            var isSelectedVal=sortList.eq(i).find("option:selected").val();
            for(var j=0;j<sortList.length;j++){
                if(isSelectedVal!=0 && j!=i){
                    sortList.eq(j).find("option[value='"+isSelectedVal+"']").attr("disabled",true);
                }
            }
            console.log("isSelectedVal:"+isSelectedVal);
        }
        for(var k=0;k<sortList.length;k++){
            sortList.eq(k).find("option[value='"+_this+"']").removeAttr("disabled");
        }
    }
</script>
</body>
</html>

关于下拉框列表不可选择相同值的设置一：当前DOM不可选的更多相关文章

  1. @Html.DropDownListFor 下拉框绑定（选择默认值）

    首先先构建绑定下拉框的数据源 private void GetSalesList() { var userList = _rmaExpressAppService.GetUserList(); Tem ...

  2. 下拉框改变事件：获取下拉框中当前选择的文本 SelectionChanged事件

    /// <summary> /// 下拉框改变事件:获取下拉框中当前选择的文本 /// </summary> /// <param name="sender&q ...

  3. form表单传递下拉框的Value和Text值，不适用Jquery传递

    同时获取下拉框的Value和Text值的解决办法:添加一个<input type="text" >文本框,用户选中一项后就将该项的value值给他 然后接受页面获取该文 ...

  4. 点击select下拉框获取option的属性值

    select下拉框作为前端开发者应该是经常使用的,最近在项目中遇到这样的情况,点击下拉框选项,需要获取所点击的option的属性值,当时想很简单啊,给option加一个点击事件不就行了,然后就加了一下 ...

  5. JavaScript获取select下拉框中的第一个值

    JavaScript获取select下拉框中的第一个值 1.说明 获取select下拉框中的第一个值 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD ...

  6. jq select change下拉框选项变化判断选中值,添加（attr)或移除(removeAttr)一个或多个属性

    select change下拉框选项变化判断选中值,添加(attr)或移除(removeAttr)一个或多个属性 $("#IsRecommend").change(function ...

  7. 动态加载下拉框列表并添加onclick事件

    1.  js动态加载元素并设置属性 摘自(http://www.liangshunet.com/ca/201408/336848696.htm) <div id="parent&quo ...

  8. QTP测试.NET程序的时候，ComboBox下拉框控件选择后，运行时对象不可见解决方案

    解决方法: 录制时,选择下拉框数据的时候,不要鼠标单击选择,而是要用ENTER(回车键)来选择,才能完成选择,这样录制就OK了.

  9. select下拉框默认不能选择第一个选项的问题

    如题,现在有个js的功能:用户选择下拉框的同时,把选择的下拉框显示出来.同时选择的不能有重复的.刚开始 使用的是 select的onchange事件: $("#liveType") ...

随机推荐

  1. iOS回顾笔记（04） -- UIScrollView的基本使用详解

    html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,bi ...

  2. JAVA开发环境搭建 - JDK安装及环境变量配置

    1.前提条件 系统:本教程以WIN7系统为例 JDK:本教程以jdk-7u79-windows-x64为例 2.安装步骤 双击运行JDK安装程序

  3. 说说如何用js实现一个模板引擎

    本文同步更新在: https://github.com/whxaxes/blog/issues/4 ,在 github 看文章显示效果会更好一些. 前言 不知不觉就很长时间没造过什么轮子了,以前一直想 ...

  4. wemall doraemon中Android app商城系统解决左侧抽屉菜单和viewpager不能兼容问题

    完美解决左侧抽屉菜单和viewpager不能兼容左右滑动的问题,可进行参考. WeMall-Client/res/layout/wemall_main_ui.xml </RadioGroup&g ...

  5. Hibernate优缺点

    下面就Hibernate优缺点分别进行简单的阐述.1.Hibernate优点:(1)对象/关系数据库映射(Basic O/R Mapping)它使用时只需要操纵对象,使开发更对象化,抛弃了数据库中心的 ...

  6. 腾讯云数据库团队：MySQL数据库的高可用性分析

    作者介绍:易固武,腾讯高级工程师,参与腾讯账号安全建设,腾讯数据仓库(TDW)优化改造,腾讯云数据库等项目,对大规模分布式存储和计算系统有浓厚的兴趣和经历 MySQL数据库是目前开源应用最大的关系型数 ...

  7. T——SQL基础语句（定义变量，赋值，取值，分支，循环，存储过程）

    T--SQL基础语句 1.定义变量: declare @变量名 数据类型 ; declare @a int ; declare @b  nvarchar(10) ; 2.赋值: 法1:set @变量名 ...

  8. 一个蛋疼的CTF图片隐写

    话不多说,直接上原题 TIPS:心中无码 打开解题链接,是一张png图片,直接用16进制编辑器打开,没有附加其它文件.看下文件区段信息也很正常. 又拖进stegsolve,Blue的0位很不正常 多次 ...

  9. self-question

    需要即刻提升的几大能力: 1.重装系统和安装各种软件 2.自学能力,多从实际案例中总结,多归纳反思 3.拓展人际关系,和别人沟通交流 4.遇到困难迎刃而上,而不是回避退缩

  10. 微信公众号java开发思路

    方法一:不开启开发模式,直接在自定义菜单中跳转到网页,适用于流量较小的公众号.   方法二:开启开发者模式,关闭自带的自定义菜单和消息回复,接入自己开发的应用           1.接入校验:创建s ...