手动调节列宽时遇到的问题

写了一个手动调整列宽的js程序，大体的要求是控制table的总宽度不变，拖动表格列的时候只改变当前列和它之后相邻列的宽度，其他的表格列不受影响。思路大概就是在每一列中用一个span来响应拖动事件，在onmousemove事件中计算当前列和其后相邻列的宽度变化。可是现在程序存在一些问题。在Firefox下当你刚刚按下鼠标拖动的时候，当前列的另一端会发生细微的伸缩，导致整个表格的宽度会发生变化，只是在刚按下拖动的那一刻，拖起来之后就不会发生这个问题了，虽然变化不是很明显，但跟我最开始保持table不动的初衷相悖了，我在IE下也测试过，但是就没有出现table变化的情况，不知道是不是我计算宽度的方法存在着兼容性的问题。还有一个bug就是如果拖动过程中鼠标移出了浏览器窗口，并且在窗口外放开了鼠标，你就会发现这个onmouseup事件没有被记录，当你把鼠标移回table上时，虽然鼠标左键已经松开，但是列宽还是会随着鼠标的移动而改变。这个问题一开始只存在于firefox中，后来我为了去掉拖曳过程中的文本选择现象，在IE的onload事件中加入了onselectstart = function(){return false;}，结果IE也变成这样了。这两个问题都比较细微，不知道各位是否理解了我的描述。我查了查资料，但还是没有头绪，希望有类似经验的朋友能，指出问题所在，附上我的代码。

有个兄弟发过一个了，写的就不错！看看你的怎么样！

我刚刚接触javascript，程序可能有不少问题，希望楼上的朋友可以多提些意见，谢谢。

http://www.iteye.com/topic/32241

哈哈 感觉比我写的那个好 支持
有机会我把两者的优点结合起来 做个跨浏览器的 新的东西
然后加到 ecside里 呵呵

fins是老手吧，代码写得很规范。
我才毕业不久，js也是上班后才开始学的。当时在网上查了一些相关资料，发现做得比较好的大多是用库做的，纯js写的似乎都存在着bug和兼容性问题。有些细节在IE下没有问题，但是在Firefox下的bug让人摸不着头脑。
ps:看到neusoft很亲切，我是neu毕业的 : )

见笑了 看了你的代码我很惭愧
我觉得我当初犯了一个很严重的错误 那就是设计过渡，想的太多了，结果应验了那句“欲求更好，常把事情弄槽”。
我觉得和你的简洁实用的代码比起来 我那个实在够糟烂的 呵呵

关于你那个：在IE的onload事件中加入了onselectstart = function(){return false;}....

的问题 我也遇到过 没有什么好的办法 一旦屏蔽onselectstart ，那么就捕捉不到离开页面的指针状态和坐标了 这个应该是ie设计问题 我觉得用js应该没办法搞定
使用类似 onmouseout onmouseover的方法也不行
答案我也在寻求中


呵呵 你现在在哪里工作啊？

似乎离开页面后就响应不到事件了，firefox也有这个问题。本来我是用的unselectable来消除文本选择的，但似乎效果不太好，所以改用的unselectstart,不过这个的效果有点过分强大了...
我现在在北京。

关于宽度的问题知道答案了

ie里按 offsetWidth计算
fireFox里按 clientWidth计算

你把 MouseDownToResize方法里的
obj.parentTdW=obj.parentNode.offsetWidth;
obj.siblingW = sibling.offsetWidth;
换成
obj.parentTdW=obj.parentNode.clientWidth;
obj.siblingW = sibling.clientWidth;

现象就正好相反了 ff里正常 ie里宽度出现偏差

误差的大小取决于 你的td的border
最好的方法是
td 的 所有边线都是0
至于边框 还是用最原始的方法来做 : table的 cellspace=1
然后在后面再加一个table