js采用map取到id集合组并且实现点击一行选中一行


Posted in Javascript onDecember 16, 2013
<tbody > 
<tr > 
<td >1</td> 
<td>楼盘开业<br>折扣大大</td> 
<td>2011-11-11</td> 
<td>短信通知</td> 
</tr> 
<tr > 
<td>2</td> 
<td>楼盘开业<br>折扣大大</td> 
<td>2011-11-11</td> 
<td>短信通知</td> 
</tr> 
</tbody> 
</table> 
</div> 
</div> <div class="span7" id="right" > 
<table id="table1"> 
<caption>详细信息列表</caption> 
<thead> 
<tr> 
<td> <input type="checkbox" name="checkbox" id="btn"/>全选</td> 
<td>短信</td> 
<td>上传时间</td> 
<td>备注</td> 
</tr> 
</thead> 
<tbody id="selectable"> 
<tr class="dragableBox" id="box1" > 
<td id="45"> <input type="checkbox" name="box1" />1</td> 
<td>开会发现<br>有错</td> 
<td>2011-01-30</td> 
<td>五</td> 
</tr> 
<tr class="dragableBox" id="box2" ondragstart="test2()"> 
<td> <input type="checkbox" name="box2" /> 
2</td> 
<td>开会发现<br>有错</td> 
<td>2011-01-30</td> 
<td>五</td> 
</tr> 
<tr class="dragableBox" id="box3" ondragstart="test2()"> 
<td> <input type="checkbox" name="box3" /> 
3</td> 
<td>开会发现<br>有错</td> 
<td>2011-01-30</td> 
<td>五</td> 
</tr> 
<tr class="dragableBox" id="box4"> 
<td> <input type="checkbox" name="box4" /> 
4</td> 
<td>开会发现<br>有错</td> 
<td>2011-01-30</td> 
<td>五</td> 
</tr> 
<tr class="dragableBox" id="box5"> 
<td> <input type="checkbox" name="box5"/> 
5</td> 
<td>开会发现<br>有错</td> 
<td>2011-01-30</td> 
<td>五</td> 
</tr> 
<tr class="dragableBox" id="box6" onclick="clickDrop()" > 
<td> <input type="checkbox" name="box6" /> 
6</td> 
<td>开会发现<br>有错</td> 
<td>2011-01-30</td> 
<td>五</td> 
</tr> 
<tr class="dragableBox" id="box7"> 
<td> <input type="checkbox" name="box7" /> 
7</td> 
<td>开会发现<br>有错</td> 
<td>2011-01-30</td> 
<td>五</td> 
</tr> 
</tbody> 
</table> 
<input type="button" value="test" onclick="test2();"/> 
<script type="text/javascript"> 
var map = new HashMap(); 
$(function(){ 
$("#table1 tr ").click(function(e){ 
var trId=this.id; 
$("input[type='checkbox']").each(function(){//遍历ID 
if(this.name==trId){ 
if(this.checked==true){ 
$(this).attr("checked",false); 
map.remove(this.name); 
var dd=document.getElementById(trId); 
dd.style.backgroundColor= "white"; 
}else{ 
$(this).attr("checked",true); 
map.put(this.name,trId); 
var dd=document.getElementById(trId); 
dd.style.backgroundColor= " #FECA40"; 
} 
} 
}); 
}); 

}); 

</script>

function HashMap() 
{ 
/** Map 大小 **/ 
var size = 0; 
/** 对象 **/ 
var entry = new Object(); /** 存 **/ 
this.put = function (key , value) 
{ 
if(!this.containsKey(key)) 
{ 
size ++ ; 
} 
entry[key] = value; 
} 
/** 取 **/ 
this.get = function (key) 
{ 
if( this.containsKey(key) ) 
{ 
return entry[key]; 
} 
else 
{ 
return null; 
} 
} 
/** 删除 **/ 
this.remove = function ( key ) 
{ 
if( delete entry[key] ) 
{ 
size --; 
} 
} 
/** 是否包含 Key **/ 
this.containsKey = function ( key ) 
{ 
return (key in entry); 
} 
/** 是否包含 Value **/ 
this.containsValue = function ( value ) 
{ 
for(var prop in entry) 
{ 
if(entry[prop] == value) 
{ 
return true; 
} 
} 
return false; 
} 
/** 所有 Value **/ 
this.values = function () 
{ 
var values = new Array(size); 
for(var prop in entry) 
{ 
values.push(entry[prop]); 
} 
return values; 
} 
/** 所有 Key **/ 
this.keys = function () 
{ 
var keys = new Array(size); 
for(var prop in entry) 
{ 
keys.push(prop); 
} 
return keys; 
} 
/** Map Size **/ 
this.size = function () 
{ 
return size; 
} 
} 
// var map = new HashMap(); 
/* 
map.put("A","1"); 
map.put("B","2"); 
map.put("A","5"); 
map.put("C","3"); 
map.put("A","4"); 
*/ 
/* 
alert(map.containsKey("XX")); 
alert(map.size()); 
alert(map.get("A")); 
alert(map.get("XX")); 
map.remove("A"); 
alert(map.size()); 
alert(map.get("A")); 
*/ 
/** 同时也可以把对象作为 Key **/ 
/* 
var arrayKey = new Array("1","2","3","4"); 
var arrayValue = new Array("A","B","C","D"); 
map.put(arrayKey,arrayValue); 
var value = map.get(arrayKey); 
for(var i = 0 ; i < value.length ; i++) 
{ 
//alert(value[i]); 
} 
*/ 
/** 把对象做为Key时 ,自动调用了该对象的 toString() 方法 其实最终还是以String对象为Key**/ 
/** 如果是自定义对象 那自己得重写 toString() 方法 否则 . 就是下面的结果 **/ 
// function MyObject(name) 
// { 
// this.name = name; 
// } 
/** 
function MyObject(name) 
{ 
this.name = name; 
this.toString = function () 
{ 
return this.name; 
} 
} 
**/ 
// var object1 = new MyObject("小张"); 
// var object2 = new MyObject("小名"); 
// 
// map.put(object1,"小张"); 
// map.put(object2,"小名"); 
// alert(map.get(object1)); 
// alert(map.get(object2)); 
// alert(map.size()); 
// 
/** 运行结果 小名 小名 size = 1 **/ 
/** 如果改成复写toString()方法的对象 , 效果就完全不一样了 **/
Javascript 相关文章推荐
javascript中的几个运算符
Jun 29 Javascript
javascript 原型模式实现OOP的再研究
Apr 09 Javascript
基于jQuery选择器的整理集合
Apr 26 Javascript
js单独获取一个checkbox看其是否被选中
Sep 22 Javascript
使用AngularJS和PHP的Laravel实现单页评论的方法
Jun 19 Javascript
Bootstrap每天必学之折叠
Apr 12 Javascript
Vue.js实现无限加载与分页功能开发
Nov 03 Javascript
微信扫码支付零云插件版实例详解
Apr 26 Javascript
详谈js模块化规范
Jul 07 Javascript
从零开始封装自己的自定义Vue组件
Oct 09 Javascript
详解微信小程序用定时器实现倒计时效果
Apr 30 Javascript
react中Suspense的使用详解
Sep 01 Javascript
js捕获鼠标滚轮事件代码
Dec 16 #Javascript
javascript调试过程中找不到哪里出错的可能原因
Dec 16 #Javascript
使用firebug进行调试javascript的示例
Dec 16 #Javascript
javascript和jquery修改a标签的href属性
Dec 16 #Javascript
JavaScript修改css样式style动态改变元素样式
Dec 16 #Javascript
使用apply方法实现javascript中的对象继承
Dec 16 #Javascript
javaScript如何生成xmlhttp
Dec 16 #Javascript
You might like
全国FM电台频率大全 - 18 湖南省
2020/03/11 无线电
php把数据表导出为Excel表的最简单、最快的方法(不用插件)
2014/05/10 PHP
php+xml结合Ajax实现点赞功能完整实例
2015/01/30 PHP
PHP编写学校网站上新生注册登陆程序的实例分享
2016/03/21 PHP
js脚本学习 比较实用的基础
2006/09/07 Javascript
从JavaScript的函数重名看其初始化方式
2007/03/08 Javascript
window.js 主要包含了页面的一些操作
2009/12/23 Javascript
如何在JavaScript中实现私有属性的写类方式(一)
2013/12/04 Javascript
JavaScript用Number方法实现string转int
2014/05/13 Javascript
JavaScript实现将数组中所有元素连接成一个字符串的方法
2015/04/06 Javascript
jQuery表格插件datatables用法详解
2020/11/23 Javascript
输入法的回车与消息发送快捷键回车的冲突解决方法
2016/08/09 Javascript
JavaScript第一篇之实现按钮全选、功能
2016/08/21 Javascript
javascript十六进制数字和ASCII字符之间的转换方法
2016/12/27 Javascript
vue下跨域设置的相关介绍
2017/08/26 Javascript
python将字符串转换成数组的方法
2015/04/29 Python
python脚本设置超时机制系统时间的方法
2016/02/21 Python
python导入时小括号大作用
2017/01/10 Python
Python pymongo模块常用操作分析
2018/09/01 Python
对python 匹配字符串开头和结尾的方法详解
2018/10/27 Python
python GUI实现小球满屏乱跑效果
2019/05/09 Python
PowerBI和Python关于数据分析的对比
2019/07/11 Python
python找出因数与质因数的方法
2019/07/25 Python
Pytorch 实现自定义参数层的例子
2019/08/17 Python
kafka监控获取指定topic的消息总量示例
2019/12/23 Python
Python中使用socks5设置全局代理的方法示例
2020/04/15 Python
Django实现微信小程序支付的示例代码
2020/09/03 Python
戴尔马来西亚官网:Dell Malaysia
2020/05/02 全球购物
模具设计与制造专业应届生求职信
2013/10/18 职场文书
幼儿园秋游活动方案
2014/01/21 职场文书
2014年团支部工作总结
2014/11/17 职场文书
党员倡议书
2015/01/19 职场文书
女方离婚起诉书
2015/05/18 职场文书
2016天猫双十一广告语
2016/01/28 职场文书
Go 自定义package包设置与导入操作
2021/05/06 Golang
Go语言测试库testify使用学习
2022/07/23 Golang