关于下拉框列表不可选择相同值的设置一:当前DOM不可选
<!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不可选的更多相关文章
- @Html.DropDownListFor 下拉框绑定(选择默认值)
首先先构建绑定下拉框的数据源 private void GetSalesList() { var userList = _rmaExpressAppService.GetUserList(); Tem ...
- 下拉框改变事件:获取下拉框中当前选择的文本 SelectionChanged事件
/// <summary> /// 下拉框改变事件:获取下拉框中当前选择的文本 /// </summary> /// <param name="sender&q ...
- form表单传递下拉框的Value和Text值,不适用Jquery传递
同时获取下拉框的Value和Text值的解决办法:添加一个<input type="text" >文本框,用户选中一项后就将该项的value值给他 然后接受页面获取该文 ...
- 点击select下拉框获取option的属性值
select下拉框作为前端开发者应该是经常使用的,最近在项目中遇到这样的情况,点击下拉框选项,需要获取所点击的option的属性值,当时想很简单啊,给option加一个点击事件不就行了,然后就加了一下 ...
- JavaScript获取select下拉框中的第一个值
JavaScript获取select下拉框中的第一个值 1.说明 获取select下拉框中的第一个值 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD ...
- jq select change下拉框选项变化判断选中值,添加(attr)或移除(removeAttr)一个或多个属性
select change下拉框选项变化判断选中值,添加(attr)或移除(removeAttr)一个或多个属性 $("#IsRecommend").change(function ...
- 动态加载下拉框列表并添加onclick事件
1. js动态加载元素并设置属性 摘自(http://www.liangshunet.com/ca/201408/336848696.htm) <div id="parent&quo ...
- QTP测试.NET程序的时候,ComboBox下拉框控件选择后,运行时对象不可见解决方案
解决方法: 录制时,选择下拉框数据的时候,不要鼠标单击选择,而是要用ENTER(回车键)来选择,才能完成选择,这样录制就OK了.
- select下拉框默认不能选择第一个选项的问题
如题,现在有个js的功能:用户选择下拉框的同时,把选择的下拉框显示出来.同时选择的不能有重复的.刚开始 使用的是 select的onchange事件: $("#liveType") ...
随机推荐
- wpf的无边框窗体透明
本人做了3年的winform,来了新的工作,需要使用wpf.对于wpf,本人小白一个.说的不对的地方,请大家多多指导.... 今天先从wpf的窗体属性开始说起! 需要做的项目功能大概和电脑桌面类似,需 ...
- 业务逻辑 : forex & mlm
业务逻辑 公司通过mlm的制度和顾客进行签约来收取资金,再把资金给第三方公司进行投资,再把所投资的回报给分配给公司和顾客. 公司的资金来自投资者,公司的营销策略来自mlm的制度,由市场人员来创建mlm ...
- Linux 搭建Zookeeper集群
1.使用root创建zookeeper用户: useradd zookeeper: passwd zookeeper; 2.登录zookeeper用户,将下载的zookeeper-3 ...
- 视频直播SDK-ios版
IOS视频直播接入说明 一.名词解释 分辨率:用于计算机视频处理的图像,以水平和垂直方向上所能显示的像素数来表示分辨率.常见视频分辨率的有1080P即1920x1080,720P即1080x720,6 ...
- 项目架构开发:数据访问层之Repository
接上文 项目架构开发:数据访问层之Logger 本章我们继续IRepository开发,这个仓储与领域模式里边的仓储有区别,更像一个工具类,也就是有些园友说的“伪仓储”, 这个仓储只实现单表的CURD ...
- C# 输入法
C# 输入法 虽说输入法不是什么新事物,各种语言版本都有,不过在C#不常见:这就会给人一种误会:C#不能做!其实C#能不能做呢,答案是肯定的--三种方式都行:IMM.TSF以及外挂式.IMM这种就是调 ...
- oracle数据库命令-持续更新
一.系统命令 登录 dba用户命令 sqlplus / as sysdba 2. 用户命令 删除用户 DROP USER **** CASCADE; DROP SCHEMA **** CASCADE; ...
- 【LeetCode】Binary Tree Level Order Traversal 【BFS】
Given a binary tree, return the level order traversal of its nodes' values. (ie, from left to right, ...
- Metadata Service 一个最简单的应用 - 每天5分钟玩转 OpenStack(164)
实现 instance 定制化,cloud-init(或 cloudbase-init)只是故事的一半,metadata service 则是故事的的另一半.两者的分工是:metadata servi ...
- eclipse和myeclipse设置默认编码格式为UTF-8
1:jsp页面设置默认为utf-8 以eclipse为例 2:java界面设置: Window->Preferences->General->Workspace 面板Text fil ...