Javascript 冻结栅格视图标题

Javascript 冻结栅格视图标题,javascript,jquery,asp.net,Javascript,Jquery,Asp.net,我用了两张桌子,第一张是头,另一张是身体。在JavaScript中,我更改了标题表的每个列宽,这与主体表相同。每次在dropdownlist上选择索引更改时,网格绑定操作都会执行。每次我在JavaScript下面使用的列宽更改时 我在这里编写JavaScript代码: jQuery(document).ready(function () { var headergrid = $('#gridHeader').find("table")[0]; var bodygrid = $('#bod

我用了两张桌子,第一张是头,另一张是身体。在JavaScript中,我更改了标题表的每个列宽,这与主体表相同。每次在dropdownlist上选择索引更改时,网格绑定操作都会执行。每次我在JavaScript下面使用的列宽更改时

我在这里编写JavaScript代码:

jQuery(document).ready(function () {
  var headergrid = $('#gridHeader').find("table")[0];
  var bodygrid = $('#bodyHeader').find("table")[0];
  var headerCellWidths = new Array();

  for (var i = 0; i < bodygrid.getElementsByTagName('TH').length; i++) {
    headerCellWidths[i] = bodygrid.getElementsByTagName('TH')[i].offsetWidth;
  }

  for (var i = 0; i < headerCellWidths.length; i++) {
    headergrid.getElementsByTagName('TH')[i].style.width = parseInt(headerCellWidths[i]) + 'px';
  }
});
ASP代码:

<div style="height: 34px; overflow: auto" id="gridHeader">
  <table id="tbltemp" width="856px">
    <tr id="temp">
      <th>
        TRANS ID
      </th>
      <th>
        VC NO.
      </th>
      <th>
        SUB NO.
      </th>
      <th>
       DOMAIN
      </th>
      <th>
        STATION
      </th>
      <th>
        DTC
      </th>
      <th>
        STATUS
      </th>
      <th>
        REMARK
      </th>
      <th>
        ENTERED DATETIME
      </th>
      <th>
      </th>
    </tr>
  </table>
</div>
<div style="width: 859px; height: 450px; overflow: auto;" id="bodyHeader">
  <asp:GridView ID="gvViewData" runat="server" AutoGenerateColumns="False" DataKeyNames="EC_TRANS_ID"
    OnRowDataBound="gvViewRow_DataBound" OnDataBound="gvViewData_DataBound" OnRowCommand="gvViewData_RowCommand"
    Visible="False" BackColor="White" 
    OnSelectedIndexChanging="gvViewData_SelectedIndexChanging"
  >
    <Columns>
      <asp:BoundField DataField="EC_TRANS_ID" HeaderText="TRANS ID" ReadOnly="True">
        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
      </asp:BoundField>
      <asp:BoundField DataField="VC_NO" HeaderText="VC NO" ReadOnly="True">
        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
      </asp:BoundField>
      <asp:BoundField DataField="SUB_NO" HeaderText="SUB NO">
        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
      </asp:BoundField>
      <asp:BoundField DataField="RESERVED" HeaderText="Part No">
        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
      </asp:BoundField>
      <asp:BoundField DataField="DOMAIN_NAME" HeaderText="DOMAIN">
        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
      </asp:BoundField>
      <asp:BoundField DataField="STATION_ID" HeaderText="STATION">
        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
      </asp:BoundField>
      <asp:BoundField DataField="DTC_CODE" HeaderText="DTC">
        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
      </asp:BoundField>
      <asp:BoundField DataField="STATUS" HeaderText="STATUS">
        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
      </asp:BoundField>
      <asp:BoundField DataField="REMARK" HeaderText="REMARK">
        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
      </asp:BoundField>
      <asp:BoundField DataField="ENTERED_DATETIME" HeaderText="ENTERED DATETIME" >
        <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
      </asp:BoundField>
      <asp:ButtonField CommandName="Prameters" Text="Parameter">
        <ItemStyle />
      </asp:ButtonField>
    </Columns>
  </asp:GridView>        
</div>

但问题是,若宽度设置为110px,那个么它被分配为105px或68px,然后它被分配为72px。请给我一些建议。

我想这就是你想要做的。请参考。不确定您使用的浏览器,但如果进入浏览器调试工具F12并检查元素。它将告诉您样式的来源