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

前端技术 2023/09/01 JavaScript
复制代码 代码如下:

<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()方法的对象 , 效果就完全不一样了 **/

本文地址:https://www.stayed.cn/item/2778

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。