如何在使用JQuery插入输入字段时控制表格单元格宽度

我在webkit的目标网页上有一个就地编辑功能。 HTML是微不足道的。如何在使用JQuery插入输入字段时控制表格单元格宽度

我附上一个单击处理程序，以每个单元使用jQuery：

$("table td").click(editMe); 

function editMe(e) { 
    var w = $(this).width(); // returns cell width 
    $(this).html("<span>Foo</span"); // does not change table width 
    $(this).html('<input type="text" />'); // CAUSES CELL width to BLOW UP! (gets VERY wide) 

    var in = $('<input type="text" />'); 
    in.width(w-10); 
    $(this).html(in); // CAUSES CELL WIDTH TO BLOW UP! (nearly doubles) 
}

设置宽度再多似乎任何区别。输入没有填充或边距，没有边框。表格单元格宽度只是berzerk。重点是Webkit（Safari/Adobe AIR）。但为什么？

我怎样才能有输入尺寸MATCH它所插入的表单元格？

来源

2011-04-21 user445658

首先，将点击附加到每个td是一个坏主意。通过委托将处理程序附加到表中。其次，如果你把jsfiddle.net放在一起，我会更愿意帮忙。 – 2011-04-21 16:33:15

好的，我没有得到确切的答案，但事实证明，罪魁祸首是960Grid CSS框架的reset.css文件。我不知道究竟是哪个设置导致了奇怪的行为，但是删除该文件修复了它。

960Grid是一个简单的CSS框架，我喜欢使用，但有关他们的reset.css文件导致我的表炸毁。只要我删除该文件，表的行为如预期。

来源

2011-04-22 17:22:03 user445658

如何在使用JQuery插入输入字段时控制表格单元格宽度

回答

相关问题