日期:2014-05-16 浏览次数:20471 次
<style type="text/css"> #list div,#list .on{ width:200px; border: 1px solid #ddd; margin: 2px; cursor: pointer; } #list .on{ border: 1px solid red; background-color: #fff731 } </style> <div id="list"> <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div> <div>6</div> <div>7</div> <div>8</div> </div> <input type="text" id="tt" style="width:200px" /> <script type="text/javascript"> $(document).ready(function(){ var key=0; //记录ctrl/shift键 var val=",";//记录已经选择的值 var ibe =-1; //记录初始值 $(window).keydown(function(e){ if(e.ctrlKey){ key=1; }else if(e.shiftKey){ key=2; } $("#bb").val("初始值:"+ibe+" key:"+key); }).keyup(function(){ key=0; }); $("#list div").click(function(){ var i=$(this).index(); if(ibe!=-1&&key==2){ $(this).siblings().removeAttr("class"); val=","; for(var ii=Math.min(i,ibe);ii<=Math.max(i,ibe);ii++){ val+=ii+","; $("#list div").eq(ii).addClass("on"); } }else if(key==1){ if(val.indexOf(","+i+",")!=-1){ val=val.replace(","+i+",",","); $(this).removeAttr("class"); }else{ val+=i+","; $(this).addClass("on"); ibe=i; } }else{ $(this).addClass("on").siblings().removeAttr("class"); ibe=i; val=","+i+","; } $("#tt").val(val); }); }); </script>
------解决方案--------------------