为了账号安全,请及时绑定邮箱和手机立即绑定

jqGrid使用jQuery获取“th”和“thead”

jqGrid使用jQuery获取“th”和“thead”

qq_花开花谢_0 2019-08-19 17:25:14
jqGrid使用jQuery获取“th”和“thead”如何theader使用jQuery 获取jqGrid?
查看完整描述

3 回答

?
幕布斯7119047

TA贡献1794条经验 获得超8个赞

我的简短回答是:而不是选择与<th>你正在寻找的元素相对应的DOM元素,你应该使用它

$("#list")[0].grid.headers

它返回此DOM元素的数组,对应于<th>。我的答案的详细描述如下。

我理解你的问题的原因。例如,如果您将jqGrid的基本部分定义为

<table id="list"></table><div id="pager"></div>

然后只$("#list")为您<table>提供没有标题的网格的“数据”部分。表格的主要“数据”部分将放在一些div中。jqGrid的其他元素将作为表放在div中。jqGrid(未完整)的结构如下所示:

div.ui-jqgrid#gbox_list
  div.ui-jqgrid-view#gview_list
    div.ui-jqgrid-titlebar              - caption
    div.ui-userdata#t_list              - optional top toolbar
    div.ui-jqgrid-toppager#list_toppager - optional top pager
    div.ui-jqgrid-hdiv                  - all grid headers
      div.ui-jqgrid-hbox                - (div.ui-jqgrid-hbox-rtl) if direction:"rtl"
        table.ui-jqgrid-htable
          thead
            tr.ui-jqgrid-labels         - row with column headers (labels)
              th#list_rn                - optional column header with row numbers
              th#list_Col1              - column header for the column name:"Col1"
              ...
              th#list_level             - optional column header for some other
                                          special columns in case of usage TreeGrid
                                          the hidden columns of TreeGrid are: level,
                                          parent, isLeaf, expanded, loaded, icon
            tr.ui-search-toolbar        - row for toolbar searching
              th
              th
              ...
    div.frozen-div.ui-jqgrid-hdiv       - optional frozen headers
        table.ui-jqgrid-htable          - table with frozen columns headers only
          ...
    div.ui-jqgrid-bdiv                  - div with the main grid data
      div
        table#list                      - table with the main grid data
    div.frozen-bdiv.ui-jqgrid-bdiv      - optional div with the main grid data
      div
        table#list_frozen               - table with the main grid data
    div.ui-userdata#tb_list             - optional bottom toolbar
  div.ui-jqgrid-resize-mark#rs_mlist
  div.ui-jqgrid-pager#pager             - the div with the pager

(在我使用的表中rownumbers: true,所以有th#list_rn,第一列的名称为'Col1',所以有th#list_Col1等等)

您可以看到,标题表table.ui-jqgrid-htable可以有两个子<tr>子元素:一个tr.ui-jqgrid-labels用于列标题,另一个tr.ui-search-toolbar用于filterToolbar

我的建议不要使用这个相对复杂的层次结构,而是使用jqGrid中存在的另一种短隐藏方式。代码

var gridDom = $("#list")[0];

得到表元素的DOM元素。这个元素有一些重要的扩展,由jqGrid构成。这gridDom.p包含jqGrid的所有参数。另一个重要的扩展是gridDom.grid有重要的属性bDivcDivhDivfbDivfhDivuDiv和也colsfooterstopDivheaders。我建议你使用gridDom.grid.headers数组作为<th>从网格列标题(从正确的<tr>行)接收元素列表的最佳方式。


查看完整回答
反对 回复 2019-08-19
?
红颜莎娜

TA贡献1842条经验 获得超12个赞

尝试:

jQuery("thead", "#mygrid")


查看完整回答
反对 回复 2019-08-19
  • 3 回答
  • 0 关注
  • 1004 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信