Question

我有几个网页，其中包含不同数量的不同数量的表格。

我正在网上寻找一个jquery spinet，它获取表格的列数，并根据列数定义每列的宽度。

实施例

  if (noOfTdOnTable == 2) {
     tdWidth = "50%";
    }
    if (noOfTdOnTable == 3) {
      td1Width = "40%";
      td2Width = "40%";
      td3Width = "20%";
    }
    if (noOfTdOnTable == 4) {
      td1Width = "35%";
      td2Width = "25%";
      td3Width = "15%";
      td4Width = "15%";
    }

更新

使用我给出的唯一答案我现在有这个，但只有在页面上有一个表时才有效，当有两列时我无法弄清楚如何应用。

        var num = $("table > td").length;


    if (num % 4 == 0) {
        $("table  > td:eq(0)").css("width", "50%");
        $("table > td:eq(1)").css("width", "30%");
        $("table > td:eq(2)").css("width", "10%");
        $("table > td:eq(3)").css("width", "10%");
    }
    if (num % 3 == 0) {
        $("table > td:eq(0)").css("width", "50%");
        $("table > td:eq(1)").css("width", "40%");
        $("table > td:eq(2)").css("width", "10%");
    }

这是html的一个示例，但代码将适用于具有不同表格的许多页面，但所有表格将具有2,3或4列。

<html>    
    <table>
           <tr>
               <td>text</td>
               <td>text</td>
               <td>text</td>
          </tr>
    </table>

    <table>
           <tr>
               <td>text</td>
               <td>text</td>
          </tr>
    </table>

    <table>
           <tr>
               <td>text</td>
               <td>text</td>
               <td>text</td>
               <td>text</td>
          </tr>
    </table>
</html>

Answer 1

获取列数：

var num = $("#table > tr > td").length;

指定宽度：

$("#table > tr > td").width(w + "px");

我希望这就是你要找的东西

修改

指定特定列的宽度：

//如果你为每个td指定了一个id

$("#td1").width(td1Width+"px");

//如果您只是使用类来识别它们

$("td.td1", "#table1").width(td1Width+"px");

我还建议您调查find()和end()以有效的方式选择列。因为进行$()通话是一项更昂贵的操作：

$("#table1").find("#td1").width(td1Width+"px").end().find("#td2")...

修改2

试试这个

$("table > tr > td:eq(0)").css("width", "50%");

甚至更好

$("table > tr > td").eq(0).css("width", "50%").end() .eq(1).css(...etc;

“table”将选择页面上的所有表格;使用id或class来标识您需要的表。

编辑3（最后!!）

好的，现在我可以看到所有代码，我可以给出更好的答案。试试这个：

var num; var $tds; $("table").each(function(i, t) { $tds = $("td", t); num = $tds.length; if (num % 4 == 0) { $tds.eq(0).css("width", "50%").end() .eq(1).css("width", "30%").end() .eq(2).css("width", "10%").end() .eq(3).css("width", "10%"); } if (num % 3 == 0) { //etc } });

我希望这是一个更好的答案：）

使用jquery根据td的No设置td的宽度

1 个答案: