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

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

如何theader使用jQuery 获取jqGrid?



qq_花开花谢_0
浏览 936回答 3
3回答

幕布斯7119047

我的简短回答是:而不是选择与<th>你正在寻找的元素相对应的DOM元素,你应该使用它$("#list")[0].grid.headers它返回此DOM元素的数组,对应于<th>。我的答案的详细描述如下。我理解你的问题的原因。例如,如果您将jqGrid的基本部分定义为<table&nbsp;id="list"></table><div&nbsp;id="pager"></div>然后只$("#list")为您<table>提供没有标题的网格的“数据”部分。表格的主要“数据”部分将放在一些div中。jqGrid的其他元素将作为表放在div中。jqGrid(未完整)的结构如下所示:div.ui-jqgrid#gbox_list &nbsp;&nbsp;div.ui-jqgrid-view#gview_list &nbsp;&nbsp;&nbsp;&nbsp;div.ui-jqgrid-titlebar&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;caption &nbsp;&nbsp;&nbsp;&nbsp;div.ui-userdata#t_list&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;optional&nbsp;top&nbsp;toolbar &nbsp;&nbsp;&nbsp;&nbsp;div.ui-jqgrid-toppager#list_toppager&nbsp;-&nbsp;optional&nbsp;top&nbsp;pager &nbsp;&nbsp;&nbsp;&nbsp;div.ui-jqgrid-hdiv&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;all&nbsp;grid&nbsp;headers &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;div.ui-jqgrid-hbox&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;(div.ui-jqgrid-hbox-rtl)&nbsp;if&nbsp;direction:"rtl" &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;table.ui-jqgrid-htable &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;thead &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tr.ui-jqgrid-labels&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;row&nbsp;with&nbsp;column&nbsp;headers&nbsp;(labels) &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;th#list_rn&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;optional&nbsp;column&nbsp;header&nbsp;with&nbsp;row&nbsp;numbers &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;th#list_Col1&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;column&nbsp;header&nbsp;for&nbsp;the&nbsp;column&nbsp;name:"Col1" &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;... &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;th#list_level&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;optional&nbsp;column&nbsp;header&nbsp;for&nbsp;some&nbsp;other &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;special&nbsp;columns&nbsp;in&nbsp;case&nbsp;of&nbsp;usage&nbsp;TreeGrid &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;the&nbsp;hidden&nbsp;columns&nbsp;of&nbsp;TreeGrid&nbsp;are:&nbsp;level, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;parent,&nbsp;isLeaf,&nbsp;expanded,&nbsp;loaded,&nbsp;icon &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tr.ui-search-toolbar&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;row&nbsp;for&nbsp;toolbar&nbsp;searching &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;th &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;th &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;... &nbsp;&nbsp;&nbsp;&nbsp;div.frozen-div.ui-jqgrid-hdiv&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;optional&nbsp;frozen&nbsp;headers &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;table.ui-jqgrid-htable&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;table&nbsp;with&nbsp;frozen&nbsp;columns&nbsp;headers&nbsp;only &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;... &nbsp;&nbsp;&nbsp;&nbsp;div.ui-jqgrid-bdiv&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;div&nbsp;with&nbsp;the&nbsp;main&nbsp;grid&nbsp;data &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;div &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;table#list&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;table&nbsp;with&nbsp;the&nbsp;main&nbsp;grid&nbsp;data &nbsp;&nbsp;&nbsp;&nbsp;div.frozen-bdiv.ui-jqgrid-bdiv&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;optional&nbsp;div&nbsp;with&nbsp;the&nbsp;main&nbsp;grid&nbsp;data &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;div &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;table#list_frozen&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;table&nbsp;with&nbsp;the&nbsp;main&nbsp;grid&nbsp;data &nbsp;&nbsp;&nbsp;&nbsp;div.ui-userdata#tb_list&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;optional&nbsp;bottom&nbsp;toolbar &nbsp;&nbsp;div.ui-jqgrid-resize-mark#rs_mlist &nbsp;&nbsp;div.ui-jqgrid-pager#pager&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-&nbsp;the&nbsp;div&nbsp;with&nbsp;the&nbsp;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&nbsp;gridDom&nbsp;=&nbsp;$("#list")[0];得到表元素的DOM元素。这个元素有一些重要的扩展,由jqGrid构成。这gridDom.p包含jqGrid的所有参数。另一个重要的扩展是gridDom.grid有重要的属性bDiv,cDiv,hDiv,fbDiv,fhDiv,uDiv和也cols,footers,topDiv和headers。我建议你使用gridDom.grid.headers数组作为<th>从网格列标题(从正确的<tr>行)接收元素列表的最佳方式。

红颜莎娜

尝试:jQuery("thead",&nbsp;"#mygrid")
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JQuery