jQuery实现的拖动调整表格td单元格的大小: 在实际应用中，可能有这样的需求，那就是需要调整td单元格的大小。 也许是为了便于观察，也许是其他原因，反正这样的需求是有的，下面就分享一段能够实现此功能的代码。 代码实例如下: 复制代码 代码如下: 脚本之家 <br /> table {<br /> border-collapse: collapse;<br /> }<br /> td {<br /> text-align: center;<br /> }<br /> <br /> (function ($){<br /> $.fn.tableresize = function () {<br /> var _document = $("body");<br /> $(this).each(function () {<br /> if (!$.tableresize) {<br /> $.tableresize = {};<br /> }<br /> var _table = $(this);<br /> //设定ID<br /> var id = _table.attr("id") || "tableresize_" + (Math.random() * 100000).toFixed(0).toString();<br /> var tr = _table.find("tr").first(), ths = tr.children(), _firstth = ths.first();<br /> //设定临时变量存放对象<br /> var cobjs = $.tableresize[id] = {};<br /> cobjs._currentObj = null, cobjs._currentLeft = null;<br /> ths.mousemove(function (e) {<br /> var _this = $(this);<br /> var left = _this.offset().left, <br /> top = _this.offset().top, <br /> width = _this.width(), <br /> height = _this.height(), <br /> right = left + width, <br /> bottom = top + height, <br /> clientX = e.clientX, <br /> clientY = e.clientY;<br /> var leftside = !_firstth.is(_this) && Math.abs(left - clientX) <= 5, <br /> rightside = Math.abs(right - clientX) <= 5;<br /> if (cobjs._currentLeft||clientY>top&&clientY<bottom&&(leftside||rightside)){<br /> _document.css("cursor", "e-resize");<br /> if (!cobjs._currentLeft) {<br /> if (leftside) {<br /> cobjs._currentObj = _this.prev();<br /> }<br /> else {<br /> cobjs._currentObj = _this;<br /> }<br /> }<br /> }<br /> else {<br /> cobjs._currentObj = null;<br /> }<br /> });<br /> ths.mouseout(function (e) {<br /> if (!cobjs._currentLeft) {<br /> cobjs._currentObj = null;<br /> _document.css("cursor", "auto");<br /> }<br /> });<br /> _document.mousedown(function (e) {<br /> if (cobjs._currentObj) {<br /> cobjs._currentLeft = e.clientX;<br /> }<br /> else {<br /> cobjs._currentLeft = null;<br /> }<br /> });<br /> _document.mouseup(function (e) {<br /> if (cobjs._currentLeft) {<br /> cobjs._currentObj.width(cobjs._currentObj.width() + (e.clientX - cobjs._currentLeft));<br /> }<br /> cobjs._currentObj = null;<br /> cobjs._currentLeft = null;<br /> _document.css("cursor", "auto");<br /> });<br /> });<br /> };<br /> })(jQuery); <br /> <br /> $(document).ready(function () {<br /> $("table").tableresize();<br /> });<br /> ID 名字 年纪 地址 电话 22 Name:44 Age:23 Address:47 Phone:15 28 Name:42 Age:68 Address:30 Phone:50 29 Name:63 Age:48 Address:90 Phone:76
