`
fangfy0537
  • 浏览: 6955 次
  • 性别: Icon_minigender_1
  • 来自: 济南
文章分类
社区版块
存档分类
最新评论

多个select 的互斥选择实现

阅读更多
/*
* 目前不支持狐火 浏览器
*
*
*
*
*
*/


/******** 声明全局变量       *****/
var selectObjects=[];//空的数组,用于构建数组对象
var selectArray=new Object();//用于存储临时select的对象数组
/***
* 初始化页面时 调用onLoad()
*
*
*/

window.onload=function(){
var newSelect=document.getElementById("000");
selectArray.selectName=newSelect.name;
//alert(selectArray.selectName+"    "+newSelect.length);
selectArray.options=[];
for(var i=0;i<newSelect.length;i++){
selectArray.options[i]=newSelect.options[i];
//alert(selectArray.options[i].innerHTML);
}
}
/******** 生成新增加的select id 号       *****/
function getId(){

var now= new Date();

var time=now.getTime();

// filePath=floderPath+retime;
//alert(filePath);
return time;

}
/****   新增一个select     ***** */
function addSelect(){
var tbody=document.all.body;
var newSelect=document.createElement("select");
newSelect.id=getId();
newSelect.name=selectArray.selectName;
  addSeletContext(newSelect);//赋值
// alert(newSelect.outerHTML+"        "+select.outerHTML);
//动态增加onchange事件
if(window.addEventListener) {// Mozilla, Netscape, Firefox

newSelect.addEventListener('change', selectchange(newSelect.id),false);
newSelect.attachEvent('mouseover',function(){return selectmouseover.apply(this,[newSelect.id]);});
}
else// IE
{
newSelect.attachEvent('onchange',function(){return selectchange.apply(this,[newSelect.id]);});
newSelect.attachEvent('onmouseover',function(){return selectmouseover.apply(this,[newSelect.id]);});
}
// newSelect.addEventListener('change', selectchange(newSelect.id),false);

tbody.appendChild(newSelect);
//增加一个 对象
addObject(newSelect);
//alert(findpreferIndexByselectId(newSelect.id));

}

/******    给新增的select 赋值                     *******/
function addSeletContext(selectTo){
//得到目标select
var selectTem=selectTo;
var selectFrom=selectArray;
//alert(selectIdTo);
var tem=selectObjects[findpreferIndexByselectId(selectTo.id)];
//alert(tem);
var value="";

// 从源select 给目标select 赋值
for(var i=0;i<selectFrom.options.length;i++){
//alert(selectFrom.options[i].value);
oOption=selectFrom.options[i];
//alert(oOption.innerHTML+"  "+oOption.value);
selectTem.options.add(new Option(oOption.innerHTML,oOption.value));
//selectTem.appendChild(oOption);
//alert(selectTem.options[i].value+"   "+oOption.innerHTML);

}
//alert("selectTem.options.length is "+selectTem.options.length)
//初始化select 的value
if(tem!=undefined){
value=selectObjects[findpreferIndexByselectId(selectTo.id)].selectValue.toString();
var innerHTML=selectObjects[findpreferIndexByselectId(selectTo.id)].selectInnerHTML;
//alert(innerHTML);
//alert("value is "+value+" selectTem.options.length is "+selectTem.options.length);
var exist=false;
for(var i=0;i<selectTem.options.length;i++){
//alert("selectTem.options[i].value is "+selectTem.options[i].value+ "value is  "+value+"== is ");
if(selectTem.options[i].value==value){
exist=true;
//selectTem.options[i].selected = true;
// alert("i  is  "+i+"   "+selectTem.options[i].selected);
}
}
if(!exist){//新生成的下拉菜单没有value 项 则添加进去 再 设为默认值
selectTem.options.add(new Option(innerHTML,value));
selectTem.value=value;

}
}

}
/****** 新增一个对象               ***/
function addObject(newSelect){
// 增加一个 对象
selectObject=new Object();
selectObject.selectId=newSelect.id;
selectObject.selectName=newSelect.name;
selectObject.selectedIndex=newSelect.selectedIndex;
//alert(newSelect.selectedIndex);
selectObject.selectValue=newSelect.options[newSelect.selectedIndex].value;
selectObject.selectInnerHTML=newSelect.options[newSelect.selectedIndex].innerHTML;
// alert(selectObject.selectInnerHTML);
selectObject.preferValue="";
selectObject.preferInnerHTML="";
selectObjects.push(selectObject);
}
/********据selectId 查出preferIndex               **********/
function findpreferIndexByselectId(id){
var i;
for(i=0;i<selectObjects.length;i++){
if(selectObjects[i].selectId==id){
return i;
}
}
//没有匹配的id 返回null
if(i>=selectObjects.length)
return null;
}
/*******select  的onchange 事件              ***/
function selectchange(id){
//alert(id);
var select=document.getElementById(id);
var selectedIndex=select.selectedIndex;
//alert(selectedIndex);

//var temString=selectArray.options.join();
//alert(temString);

//用Object 保存select的value
selectObjects[findpreferIndexByselectId(id)].selectValue=select.options[selectedIndex].value;
selectObjects[findpreferIndexByselectId(id)].selectInnerHTML=select.options[selectedIndex].innerHTML;
//alert("findpreferIndexByselectId(id) is  "+findpreferIndexByselectId(id)+"select.options[selectedIndex].value is "+selectObjects[findpreferIndexByselectId(id)].selectValue);
//alert("length is "+selectArray.options.length);
//删除 临时数组的options
var index=selectArray.options.indexOf(select.options[selectedIndex]);
if(index!=-1)
selectArray.options.splice(index,1);
//alert("new length is "+selectArray.options.length)
//selectObjects[findpreferIndexByselectId(id).split(',')].
//把获得焦点的select添置于selectArray
var option=new Object();
option.value=selectObjects[findpreferIndexByselectId(id)].preferValue;
option.innerHTML=selectObjects[findpreferIndexByselectId(id)].preferInnerHTML;
//alert(option.value);
selectArrayAdd(option);
//其他的select重新赋值
selectAllassignment(id);
}
Array.prototype.indexOf = function(str){
for(var i=0;i<this.length;i++){
if(str.value==this[i].value){
return i;
}
}
return -1;
}
/************ select 的 onmouseover 事件    ************/
function selectmouseover(id){
//Object存储 select 的preferValue
var select=document.getElementById(id);
var idtem=findpreferIndexByselectId(id);
//alert(select.selectedIndex);
selectObjects[idtem].preferValue=select.options[select.selectedIndex].value;
selectObjects[idtem].preferInnerHTML=select.options[select.selectedIndex].innerHTML;
//alert("idtem  is  "+idtem+"selectValue is  "+selectObjects[idtem].preferValue);
//把获得焦点的select添置于selectArray
//selectArrayAdd(select.options[select.selectedIndex]);

}
/******让动态生成的select 重新赋值   * */
function selectAllassignment(id){
for(var i=0;i<selectObjects.length;i++){
var idtem=selectObjects[i].selectId;
//alert(idtem+"id  is "+id);
if(idtem!=id){
var select=document.getElementById(idtem);
//清除已有的option
//alert(select.options.length);
while(select.options.length>0){
select.remove(0);
//alert("j is "+j);
}
// 重新赋值
addSeletContext(select);

//alert("findpreferIndexByselectId(id) is "+findpreferIndexByselectId(idtem)+" value is  "+selectObjects[findpreferIndexByselectId(idtem)].selectValue);
}
else{//select.id 号 为id 的select 不用重新赋值
//alert("选中的select 的id is  "+id);
}

}
}
/**  向selectArray添加数据, selectArray已经存在该数据不添加, 无则添致尾部
*
*/

function selectArrayAdd(option){
var exist=false;
for(var i=0;i<selectArray.options.length;i++){
if(selectArray.options[i].value==option.value){
exist=true;
}
}
if(!exist){
selectArray.options.push(option);
}
}
分享到:
评论

相关推荐

    Qt5 qml TreeView 迄今为止功能最全的树控件节点前增减节点、节点后增加节点、重命名节点及节点选中、悬浮背景颜色定制等功能

    迄今为止功能最全,最好用的qml树控件。 包含功能,任意位置删除节点、任意位置增加节点,节点重命名,背景颜色定制等功能。

    umutex:Golang解锁互斥锁

    解除互斥锁这个简单的程序包为那些不想编写很多select子句或不想被众多渠道弄糊涂的人提供了无阻塞的互斥锁。使用范例 package mainimport ("fmt""github.com/yudai/umutex")func main () {// Create mutexmutex := ...

    linux网络编程

    15socket编程(十) 用select改进第八章点对点聊天程序 16socket编程(十一) 套接字I/O超时设置方法 用select实现超时 read_timeout函数封装 write_timeout函数封装 accept_timeout函数封装 connect_timeout函数...

    2018年C++教程网的linux网络编程视频共41集百度云下载链接.rar

    用信号量实现进程互斥示例 32System V信号量(三) 用信号集解决哲学家就餐问题 33System V共享内存与信号量综合 用信号量解决生产者消费者问题 实现shmfifo 34POSIX消息队列 POSIX消息队列相关函数 POSIX消息队列...

    C++教程网《Linux网络编程》视频百度云地址

    用信号量实现进程互斥示例 32System V信号量(三) 用信号集解决哲学家就餐问题 33System V共享内存与信号量综合 用信号量解决生产者消费者问题 实现shmfifo 34POSIX消息队列 POSIX消息队列相关函数 POSIX...

    Linux网络编程 视频 教程

    用信号量实现进程互斥示例 32System V信号量(三) 用信号集解决哲学家就餐问题 33System V共享内存与信号量综合 用信号量解决生产者消费者问题 实现shmfifo 34POSIX消息队列 POSIX消息队列相关函数 POSIX...

    C++教程网视频:linux网络编程

    用信号量实现进程互斥示例 32System V信号量(三) 用信号集解决哲学家就餐问题 33System V共享内存与信号量综合 用信号量解决生产者消费者问题 实现shmfifo 34POSIX消息队列 POSIX消息队列相关函数 POSIX...

    c++教程网的linux网络编程视频下载

    用信号量实现进程互斥示例 32System V信号量(三) 用信号集解决哲学家就餐问题 33System V共享内存与信号量综合 用信号量解决生产者消费者问题 实现shmfifo 34POSIX消息队列 POSIX消息队列相关函数 POSIX...

    [免费]2018年C++教程网的linux网络编程视频百度云下载链接.rar

    用信号量实现进程互斥示例 32System V信号量(三) 用信号集解决哲学家就餐问题 33System V共享内存与信号量综合 用信号量解决生产者消费者问题 实现shmfifo 34POSIX消息队列 POSIX消息队列相关函数 POSIX...

    FreeBSD操作系统设计与实现

    6.4.6 select调用的实现 6.4.7 数据在内核中的转移 6.5 虚拟文件系统的接口 6.5.1 vnode的内容 6.5.2 对vnode的操作 6.5.3 路径名转换 6.5.4 文件系统的导出服务 6.6 与文件系统无关的服务 6.6.1 名字缓存 6.6.2 ...

    UNIX网络编程 卷2:进程间通信

     10.10 多个生产者,多个消费者 196  10.11 多个缓冲区 199  10.12 进程间共享信号量 205  10.13 信号量限制 206  10.14 使用FIFO实现信号量 206  10.15 使用内存映射I/O实现信号量 210  10.16 使用System V...

    UNIX网络编程 卷2 进程间通信 带完整书签,完整目录

    10.10 多个生产者,多个消费者 196 10.11 多个缓冲区 199 10.12 进程间共享信号量 205 10.13 信号量限制 206 10.14 使用FIFO实现信号量 206 10.15 使用内存映射I/O实现信号量 210 10.16 使用System V信号量...

    《UNIX网络编程 第2版. 第2卷, 进程间通信(中文版)》(W·Richard Stevens[美] 著)

    10.10 多个生产者,多个消费者 196 10.11 多个缓冲区 199 10.12 进程间共享信号量 205 10.13 信号量限制 206 10.14 使用FIFO实现信号量 206 10.15 使用内存映射I/O实现信号量 210 10.16 使用System V信号量实现Posix...

    UNIX网络编程 第2卷 进程间通信

    10.10 多个生产者,多个消费者 196 10.11 多个缓冲区 199 10.12 进程间共享信号量 205 10.13 信号量限制 206 10.14 使用FIFO实现信号量 206 10.15 使用内存映射I/O实现信号量 210 10.16 使用System V信号量实现Posix...

    django解决订单并发问题【推荐】

    在多个用户同时发起对同一个商品的下单请求时,先查询商品库存,再修改商品库存,会出现资源竞争问题,导致库存的最终结果出现异常。 解决办法: 悲观锁 当查询某条记录时,即让数据库为该记录加锁,锁住记录后...

    C#编程经验技巧宝典

    43 &lt;br&gt;0061 树的实现 44 &lt;br&gt;3.2 排序 48 &lt;br&gt;0062 如何实现选择排序算法 48 &lt;br&gt;0063 如何实现冒泡排序算法 49 &lt;br&gt;0064 如何实现快速排序算法 50 &lt;br&gt;0065 如何实现插入排序算法 ...

    音视频学习之rtsp服务器

    )基础,大概知道线程,互斥锁,同步,select模型,cpp基础,容器,封装,语法,其中虚函数的用法很多,让我了解了虚函数多态的强大,然后就是音视频基础,你需要知道acc,h264,rtcp,rtp,rtsp这些东西是什么,有...

    《程序天下:JavaScript实例自学手册》光盘源码

    6.2 实现两个select的同步 6.3 被选中的列表项下次不能再选 6.4 不带滚动条的select 6.5 从一个下拉列表往另一个下拉列表添加内容 6.6 改变列表项的上下顺序 6.7 给下拉框数据分组 6.8 获取列表框的选择 6.9 类IE...

    程序天下:JavaScript实例自学手册

    6.2 实现两个select的同步 6.3 被选中的列表项下次不能再选 6.4 不带滚动条的select 6.5 从一个下拉列表往另一个下拉列表添加内容 6.6 改变列表项的上下顺序 6.7 给下拉框数据分组 6.8 获取列表框的选择 6.9 类IE...

Global site tag (gtag.js) - Google Analytics