jqGrid bekommen "th" und "thead" mit jQuery

Meine kurze Antwort ist: statt der Auswahl von DOM-Elementen, das entspricht <th> Elemente, die Sie suchen, sollten Sie verwenden

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

Gibt es die array-dieser DOM-Elemente, entspricht der <th>. Die lange Beschreibung meiner Antwort folgt.

Verstehe ich den Grund Ihrer Frage. Wenn Sie zum Beispiel definiert das Basisteil von jqGrid als

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

dann $("#list") gibt Sie <table> nur mit der "Daten" Teil des Rasters ohne Header. Die wichtigsten "Daten" - Teil der Tabelle platziert einige divs. Andere Elemente von jqGrid in den divs als Tabellen. Die Struktur von jqGrid (nicht vollständige) wird, sieht wie folgt aus:

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

(hier in der Tabelle, die ich verwendet rownumbers: true gibt, so gibt es th#list_rn, die erste Spalte hat den Namen "Col1", so gibt es th#list_Col1 und so weiter)

Können Sie sehen, dass die Kopfzeile der Tabelle table.ui-jqgrid-htable können hat zwei Kind <tr> Unterelemente: ein tr.ui-jqgrid-labels für die Spaltenüberschriften und eine tr.ui-search-toolbar für die filterToolbar.

Mein Vorschlag für Sie nicht dieses relativ komplexe Hierarchie, aber verwenden Sie noch eine kurze versteckte Art und Weise in bestehende jqGrid. Der code

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

bekommen Sie DOM-Elements des tabellenelements. Dieses element hat einige wichtige Erweiterung, die von jqGrid. Diese sind gridDom.p enthalten alle Parameter, die von jqGrid. Eine weitere wichtige Erweiterung ist gridDom.grid mit wichtigen Eigenschaften bDiv, cDiv, hDiv, fbDiv, fhDiv, uDiv und auch cols, footers, topDiv und headers. Ich schlage vor, Sie verwenden gridDom.grid.headers array als der beste Weg, um zu erhalten eine Liste der <th> Elemente aus der Spalte Header (von der richtigen <tr> Zeile).

Versuchen:

jQuery("thead", "#mygrid")