`
a137268431
  • 浏览: 154428 次
文章分类
社区版块
存档分类
最新评论

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

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


分享到:
评论

相关推荐

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

    本例中提到的核心技术是如何利用JavaScript与HTML结合来实现表格中某一行点击时对应行被选中,并且涉及到使用Map对象来存储id集合组。以下内容详细解释了这些知识点。 ### 知识点一:HTML中的表格操作 在HTML文...

    js封装Map集合

    项目需要 像Java一样用js自己封装了一个Map集合 希望和大家一起分享

    js自定义map集合

    由于原本把需要的数据存放到cookie中,但是cookie不能的key不能自动转译中文,出现乱码,后台服务器报错:Control character in cookie value or attribute.所以改为自定义map集合

    JavaScript实现Array(数组)和Map

    `object.js` 文件可能涉及到的是JavaScript对象的操作,虽然不是直接与Array或Map相关,但它们在JavaScript中是重要的数据结构。JavaScript对象是一种键值对的集合,键通常是字符串,但也可以是符号(Symbol)。与...

    hibernate map 集合映射

    在Java的持久化框架Hibernate中,集合映射是将数据库中的表关系映射到对象的集合属性上,以便更好地管理和操作数据。这篇文章将深入探讨Hibernate中的集合映射机制,包括其基本概念、类型以及如何在实际开发中进行...

    map集合以及IO流

    在Java编程语言中,`Map`集合是一种存储键值对的数据结构,它提供了高效的数据查找和操作机制。本文将深入探讨`Map`集合的特性和遍历方式,以及`Set`特性的排序,并介绍如何使用`IO流`,特别是字节流和字符流。 ...

    读取Excel文件将数据存入map集合

    本篇文章介绍了一个方法,该方法能够读取Excel文件并将其中的数据存储到Java中的`Map`集合里,便于后续进行数据分析或处理。 #### 方法概述 方法签名如下: ```java public Map, Map, String&gt;&gt; importReportExcel...

    js-map js-map

    js map js map js map js map js map js map

    js 实现map的方式

    JavaScript中的Map对象是一种数据结构,它允许我们存储键值对,并且键可以是任何类型,而不仅仅是字符串。Map对象在JavaScript ES6版本中被引入,为处理复杂的数据关联提供了更强大的工具,尤其对于那些需要使用非...

    Javascript 中类似Map集合的实现键值对

    在JavaScript中,`Map`集合是一个内置的数据结构,用于存储键值对,它与对象不同,因为对象的键必须是字符串或符号,而`Map`则可以使用任何可哈希的值作为键。这篇博客文章可能探讨了如何通过自定义方式实现一个类似...

    js模拟list和map

    javascript 模拟 java中的 List,Map js文件为 js/utils.js IE6.0 测试通过 &lt;br&gt;List: add(var obj) //添加一个元素 remove(var index) //删除一个元素 get(var index) //获取一个元素 remove...

    利用js实现Map

    在JavaScript的世界里,`Map`对象是一个强大的数据结构,它允许我们存储键值对,且键可以是任意类型,而不仅仅是字符串。这与原生的`Object`有着本质的区别,`Object`的键必须是字符串或符号。本文将深入探讨`Map`...

    Map集合笔记

    ### Map集合概述与特点 ...通过以上内容的学习,我们可以了解到Map集合的基本特性和常用方法,以及如何使用这些方法进行数据的操作。这为我们在实际开发中高效地管理和操作数据提供了强大的支持。

    【Flutter】Dart 数据类型 Map 类型 ( 创建 Map 集合 初始化 Map 集合 遍历 Map 集合 ).zip

    【Flutter】Dart 数据类型 Map 类型 ( 创建 Map 集合 | 初始化 Map 集合 | 遍历 Map 集合 ) https://hanshuliang.blog.csdn.net/article/details/113700234 博客源码快照

    map/list集合转化成xml字符串 xml字符串转化成map/list集合

    本篇文章将详细介绍如何将Map和List集合转换为XML字符串,以及如何将XML字符串反向转换回Map和List集合。 首先,让我们探讨`Map`集合转成XML字符串的过程。一个`Map`对象存储键值对,可以使用各种库如`JAXB (Java ...

    js封装的Map集合,用法与java一致

    js封装的Map集合,用法与java一致,js封装的Map集合,用法与java一致

    易语言仿java集合 list map源码

    本主题聚焦于易语言中的面向对象编程,特别是模仿Java集合框架的List和Map接口的实现。这些数据结构在编程中扮演着核心角色,用于组织和管理数据。 首先,让我们深入了解易语言的面向对象编程概念。面向对象编程...

    java集合MAP三种遍历

    在Java编程语言中,`Map`接口是一种非常重要的数据结构,它存储键值对,并确保每个键都是唯一的。本文将详细介绍Java中Map集合的三种遍历方法及其应用场景、优缺点等,帮助读者更好地理解和掌握Map的使用技巧。 ###...

    js模仿java的Map集合,实现功能

    js模仿java的Map集合,实现功能。size()方法,put()方法,remove()方法等

Global site tag (gtag.js) - Google Analytics