使光标转向 .jqxgrid 列 headers 上的指针

Question

我正在使用 jqxgrid，当悬停在列的 header 名称上时，我需要将光标更改为指针。我尝试在 .jqx-grid-columngroup-header、.jqx-grid-column-header 和 .jqx-widget-header.

上使用 CSS

#jqxWidget .jqx-grid-columngroup-header:hover,
.jqx-grid-column-header:hover,
.jqx-widget-header:hover {
    cursor: pointer;
}

所有这一切似乎只是让光标变成 header 周围的指针，而不是 header 本身。我希望鼠标悬停在 header 的文字上时出现指针，而不是它周围的 space。

我检查了网页上的元素，它向我显示了这个：

<span style="text-overflow: ellipsis; cursor: default;">Column Name</span>

显然，跨度上的 CSS 覆盖了我所做的任何事情并造成了我的问题。我试图为此搜索我的 CSS 文件，但找不到它。

有人可以帮我解决这个问题吗？

编辑：我也在标记 javascript。当使用 javascript?

渲染网格时，也许我可以做些什么

Answer 1

在尝试了几乎所有我能想到的方法之后，我想出了一个笨拙的解决方案。

在 jqx 网格本身中，我向每一列 header 标签添加了一个新的 class，并且 class 将光标更改为指针。

在每列的网格中header：

 columns: [{ text: "Header Name", 
             datafield: "Data", 
             width: 160, 
             menu: false, 
             rendered: function (header) {
                          header.html("<span class='jqxheaderlabel'>Header Name</span>") 
                       }
           }]

在我的 CSS:

.jqxheaderlabel {
cursor: pointer !important;
}

如果有人能提出更清洁的解决方案，我们将不胜感激。

使光标转向 .jqxgrid 列 headers 上的指针

Make cursor turn to pointer on .jqxgrid column headers

javascript

jqxgrid

jqxwidgets