Jquery根據字段內容設置字段寬度

　　來博客園很久了，初次寫文章，新手，請大牛見諒！

　　前段時間遇到的問題，通過gridview后台動態生成table，列和行數量未知，要求根據每個單元格內容的多少，設置寬度，每一列選擇本列最大的寬度。

　　table生成的樣式如下，沒有找到直接通過后台解決的方案，遂決定通過前台Jquery，后期加工，雖然每行的列數是未知的，但由於有分頁，每頁最多顯示10條，所以效率問題還不算是個問題。

<table>
    <tr>
        <th>標題1</th>
        <th>標題2</th>
        <th>標題3</th>
        <th>標題4</th>
    </tr>
    <tr>
          <td>行1列1</td>
          <td>行1列2</td>
          <td>行1列3</td>
          <td>行1列4</td>
     </tr>
</table>

 

Jquery代碼：

$(function () {
       var columns = $("table tr td").length / ($("table tr").length - 1);  //計算列數
     for (var i = 1; i <= columns; i++) {
             var a = new Array();
             var j = 0;
             var max = 0;
             $("table  tr td:nth-child(" + i + ")").each(function () {  //遍歷每一列
               var data = $(this).html();
                     a[j] = data.length * 13;//假設每個字符13px
                     if (a[j] > max)
                         max = a[j];
                     $(this).css({ "width": (data.length * 13) + "px" });//設置每個td的寬度
                    j++;
              });
             if (max > 110)//默認寬度為110px
                 $("table tr th:eq(" + (i - 1) + ")").css({ "width": max + "px" });//設置標題th的寬度
         }
 });

　　如果大家有好的實現方式，還請多多留言，在此表示感謝，小菜的進步離不開大家的支持···