1

我有这个表，每列都有一个文本框（它们将用于过滤）。文本框应与相应列的宽度相同。

据我所知（简化版）：http: //jsfiddle.net/9uUpP/

伪代码解释了我正在尝试对当前脚本执行的操作：

document ready{
    var index = 0;
    for each(th){
        textboxNr(index).width = this.width;
        index++;
    }
}

如您所见，文本框的宽度与列不匹配。

重要：表格+内容是生成的，可能会不时发生变化，所以我必须做一个动态的解决方案。列数将始终相同，但它们的宽度可能会改变

4

3 回答 3

2

第一个孩子不会是第 0 个孩子。所以 index 最初应该是 1。

看这里。它说儿童索引从 1 开始。

然后px不需要宽度，只要值就足够了。在这里检查

这是更新的工作jsFiddle

你的代码应该是，

$(document).ready(function () {
    var index = 1;
    $("#table th").each(function () {
        $('input[type="text"]:nth-child('+index+')').css('width',$(this).width());
        index = index+1;
    });
});
于 2013-07-31T13:39:42.620 回答
1

不需要额外的变量，您可以index在方法本身中使用参数each，以及:eq() Selector类似的：

$(document).ready(function () {
    $("#table th").each(function (index) {
        $('input[type="text"]:eq(' + index + ')').css('width', $(this).width());
    });
});

我在:eq()这里使用了，而不是:nth-child(n)因为 :nth-child(n)使用基于 1 的索引来符合 CSS 规范，但是方法index中的参数each从开始0并:eq()使用基于 0 的索引。

小提琴演示

于 2013-07-31T13:44:03.850 回答
0

我认为索引不正确...

$(document).ready(function () {
    $("#table th").each(function (i, v) {
        $('input[type="text"]:nth-child(' + (i+1) + ')').css('width', $(this).width() + 'px');
    });
});

jsFiddle 演示！

于 2013-07-31T13:50:26.117 回答