<!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. EFDB 基本规范&知识

    public abstract class AccountRole //这是继承类型 { [Key] public int ID { get; set; } public bool isDisable ...

  2. 前端发展态势 && 前端工作流程个人浅析

    于在未开启cleartype的情况下,一些中文字体在非偶数字号下的显示效果欠佳,所以一般建议使用12.14.16.18.22px等偶数字号.也就 是对某个分辨率选择离它最近的偶数字号.例如:屏幕横向分 ...

  3. call by value or reference ?

    Java中参数传递是传值还是传引用呢?很多人遇到这个问题都会马上给你抛出这个例子: class Entry{ Integer value; public Entry(Integer v){ this. ...

  4. 道路修建 2（自创题+题解）（From NOI2011）

    道路修建这道题想来各位不陌生(传送门在此——Bzoj2435),看了此题,一开始以为是最初各个点处于分散状态,然后做了一下,直到发现标程都有点问题,才发现原题是说本来各点已经处于连接完毕的状态(phi ...

  5. Java 开机启动

    1.授权: <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED">< ...

  6. java中的对象

    对象                     --计算机语言中的对象 通常,我们可以从一般事物的三个方面,去认识事物: 一.是什么? 二.为什么? 三.怎么样? 接下来,我们也利用这三个方面的思维,去 ...

  7. HTTP协议分析

    一.域名概述 1.域名解析的作用: 主机数量增多时,IP地址不容易记忆,域名方便记忆.域名记忆更加直观. 2.hosts文件 早期通过hosts文件进行域名的解析,Linux系统中hosts文件存放路 ...

  8. ipconfig显示IP地址情况

    1.以太网适配器 Local Area Connection 若电脑是本地连接,则ipv4地址是本机的ip地址,默认网关一般为本机所连接路由器的地址. 2.无线局域网适配器 Wireless Netw ...

  9. 樱花的季节，教大家用canvas画出飞舞的樱花树

    又到了樱花的季节,教大家使用canvas画出飞舞的樱花树效果. 废话少说,先看效果. 演示效果地址:http://suohb.com/work/tree4.htm 查看演示效果 第一步,我们先画出一棵 ...

  10. WIMP环境搭建

    h1 { color: #3366ff } p { font-size: 16px } body { background-color: rgb(200,200,169) } 环境说明 系统:wind ...