报表SHIFT多选

表格SHIFT多选
我现在有一个自己做的控件由于checkbox太多我想实现按住Shift多选的效果，请高手解答。注：现在我创建的checkbox每个id不容易获取。
------解决方案--------------------

<table  id="tb1" width="100%" cellpadding="0" cellspacing="0" border="1">

   <tr><td>aaa</td><td>bbb</td><td>ccc</td><td>ddd</td></tr>

</table>

<script>

	var tb=document.getElementById('tb1');

	function add(rowCount){

		 var rs=tb.rows,ii=0,cs=tb.rows[0].cells.length;

		 for(var i=0;i<rowCount;i++){

		 	  var r=tb.insertRow(-1);

		 		for(var j=0;j<cs;j++){

		 			r.insertCell(-1).appendChild( cEl('input',{type:'checkbox', i:ii,value:ii,id: 'ch'+ ii++  }  )  );

		 		}

		 }

	}

	function cEl(tag,attrs){

		var el=document.createElement(tag);

		for(var k in attrs) el[k]=attrs[k]

 		return el

	}

	add(10);//生成测试数据 

/////////////////////////////////////////

function getP(el,td){

	while( el&& el.tagName!= td.toUpperCase()) el= el.parentNode;

	return el;

}



var actCh,

	chs=tb.getElementsByTagName('input');

tb.onclick=function(evt){

	evt=window.event
------解决方案--------------------
evt;

	var el=evt.srcElement
------解决方案--------------------
evt.target;

	var ch=getP(el,'td').getElementsByTagName('input')[0];



	if(actCh &&  evt.shiftKey ) selChs(ch)

 

  actCh&&(actCh.parentNode.bgColor='#ffffff');

  ch.parentNode.bgColor='#fafaff';

	actCh=ch;



}

function selChs(ch){

  var cs=[actCh,ch].sort(function(a,b){ return a.i-b.i})

	for(var i=cs[0].i;i<=cs[1].i;i++) chs[i].checked= !chs[i].checked;

}

</script>

------解决方案--------------------
这种想法很有创意，但是无法实现，楼主可以换个思路，
放个【全选】按钮，在内部再进行自动选中就好了。
可以用行全选，或者列全选的方式
------解决方案--------------------
复选框不就是多选了么？ id不容易获取！命名很重要！
------解决方案--------------------

function SelectRow(selectObj) {

    var row = $(selectObj).parent().parent(); // 找到TR

    var find = false;

    $(row).find(":checkbox").each(function() {

        if (find) {

            $(this).prop("checked", true);

        } else {

            // 通过值比较找到当前的选中框，并选中当前行当前选中框之后的选中框

            if ($(this).val() == $(selectObj).val()) {

                find = true;

            }

        }

    });

}

------解决方案--------------------

引用:

  
还一个问题，如果我创建的checkbox的id值不确定，能不能用获取点击行列的方式，不使用定义id的方式来实现

改成了以行为单位来选, 
和checkbox 的ID没关系 

 

<table  id="tb1" width="100%" cellpadding="0" cellspacing="0" border="1">

   <tr><td>aaa</td><td>bbb</td><td>ccc</td><td>ddd</td></tr>

</table>

<script>

	var tb=document.getElementById('tb1');

	function add(rowCount){

		 var rs=tb.rows,ii=0,cs=tb.rows[0].cells.length;

		 for(var i=0;i<rowCount;i++){

		 	  var r=tb.insertRow(-1);

		 		for(var j=0;j<cs;j++){

		 			r.insertCell(-1).appendChild( cEl('input',{type:'checkbox',value:ii,id: 'ch'+ ii++  }  )  );

		 		}

		 }

	}

	function cEl(tag,attrs){

		var el=document.createElement(tag);

		for(var k in attrs) el[k]=attrs[k]

 		return el

	}

	add(10);//生成测试数据 

/////////////////////////////////////////

function getP(el,td){

	while( el&& el.tagName!= td.toUpperCase()) el= el.parentNode;

	return el;

}



var actCh,

	chs=tb.getElementsByTagName('input'),L=chs.length;

while(L--)chs[L].i=L;

tb.onclick=function(evt){

	evt=window.event
------解决方案--------------------