JQuery拖动鼠标(mousedown,mouseup)后可以选择多个单元格，怎么实现
JQuery拖动鼠标(mousedown,mouseup)后可以选择多个单元格，如何实现？
由于本人大都高后台，所以对于前台的JS一直没怎么系统的学习过，现在在做一个小工具的时候，遇到个问题，希望得到JS大神们的帮助，谢谢。
希望高手给出一份完整的可以执行的代码，多谢~~~
要求：Jquery。
（1）一个table表格有4行40列。
（2）在任意单元格，按下鼠标后，可以选中多个列（只能是列），松开鼠标后，这些单元格的背景色变化。（就像是Excel拖动单元格选择似的那种）
（3）有一个函数接收并打印出来，（2）操作的：行ID，列（StartID，EndID)
另外，
如果所选中的那些单元格，可不可以合并，然后添加有边框的一个DIV。
如果有这方面的插件希望也能推荐下（但不是要那种点击后，输入的…………）
------解决方案--------------------
写了一个可以试试，行列数量不重要，功能：
点击后移动变颜色，可以来回移动，mouseup的时候输出 ID，从ID可以直接看出行列 r1c23 就是第一行23列
当然也做了一个td 的id属性的初始化。比你要求的改进了点，不是松开鼠标才变色，是实时的变色
合并还没看，睡了先
由于本人大都高后台，所以对于前台的JS一直没怎么系统的学习过，现在在做一个小工具的时候，遇到个问题，希望得到JS大神们的帮助，谢谢。
希望高手给出一份完整的可以执行的代码，多谢~~~
要求：Jquery。
（1）一个table表格有4行40列。
（2）在任意单元格，按下鼠标后，可以选中多个列（只能是列），松开鼠标后，这些单元格的背景色变化。（就像是Excel拖动单元格选择似的那种）
（3）有一个函数接收并打印出来，（2）操作的：行ID，列（StartID，EndID)
另外，
如果所选中的那些单元格，可不可以合并，然后添加有边框的一个DIV。
如果有这方面的插件希望也能推荐下（但不是要那种点击后，输入的…………）
------解决方案--------------------
写了一个可以试试，行列数量不重要，功能：
点击后移动变颜色，可以来回移动，mouseup的时候输出 ID，从ID可以直接看出行列 r1c23 就是第一行23列
当然也做了一个td 的id属性的初始化。比你要求的改进了点，不是松开鼠标才变色，是实时的变色
合并还没看，睡了先
<!DOCTYPE HTML>
<HTML>
<head>
<TITLE>The document title</TITLE>
<meta charset=utf-8>
<script src="lib/jquery-1.8.1.min.js" type="text/javascript"></script>
<style type="text/css">
td{
height: 50px;
width: 50px;
}
</style>
</head>
<body>
<table border="1">
<tr id ="r1">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr id ="r2">
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
<p id ='log'></p>
<script type="text/javascript">
var selectecdlog = [];
var resultLen = 0;
var resultBegin = 0;
$("td").mousedown(function() {
selectecdlog = []
// ID for tr tag
//alert($(this).parent().attr('id'));
//get the column No.
//alert($(this).index()+1);
$(this).css('background-color', 'red');
selectecdlog.push($(this).attr('id'));
//alert($(this).attr('id'));
$("td").mouseup(onMouseUp);
$("td").mouseover(onMouseOver);
})