根据排序或不更改光标样式答案

【问题标题】：Change cursor style depending on sort or not根据排序或不更改光标样式
【发布时间】：2011-08-04 03:06:29
【问题描述】：

我正在使用 jqGrid 并且有 3 列无法排序。此时，当用户将鼠标悬停在标题上时，无论排序设置为 true 还是 false，光标都会变为手形。我希望该光标不是那些列标题上的手（文本或指针）。这种方式让用户感到困惑。这是可以设置的吗？

谢谢，标记

【问题讨论】：

【解决方案1】：

欢迎来到 SO。

当然。 CSS：

th.unsortableclass {
cursor: default;
}

现在将该类应用于不可排序的列标题。

【讨论】：

OK.. 我很确定我做错了。这是我所拥有的： $("#list").jqGrid('setLabel', 5, 'Description', {'cursor':'pointer'});它不起作用。如果我更改“描述”它会改变，如果我将样式更改为基于文本，它会改变。所以我假设 setLabel 不正确。提示？
我不熟悉 jqGrid，但您只需要查看该调用的参数即可。这是一个页面：trirand.com/jqgridwiki/doku.php?id=wiki:conventions 检查列格式的东西。看起来你可以把 cursor: default 放在那里。

【解决方案2】：

$("jquery selector to pick only non-sorted columns").css("cursor", "default");

【讨论】：

【解决方案3】：

我觉得这个问题很好。所以我要 +1。

您不是第一个（也不是最后一个）希望在不可排序的列上有另一个光标的人。很遗憾，但 jqGrid 没有为您提供类或其他一些简单的属性，这些属性可用于查找可以设置 CSS "cursor:default" 的元素。

所以我建议使用以下代码：

var myGrid = $("#list");

// create the grid
myGrid.jqGrid({
  // all jqGrid parameters
});

// fix cursor on non-sortable columns
var cm = myGrid[0].p.colModel;
$.each(myGrid[0].grid.headers, function(index, value) {
    var cmi = cm[index], colName = cmi.name;
    if(!cmi.sortable && colName!=='rn' && colName!=='cb' && colName!=='subgrid') {
        $('div.ui-jqgrid-sortable',value.el).css({cursor:"default"});
    }
});

您可以在the demo live 上看到该方法有效。在演示中，最后一列“Notes”是不可排序的。

如果这种行为在 jqGrid 的下一个版本中成为标准，那就太好了。我会找时间写建议，应该从 jqGrid 的代码中更改哪些内容以使行为开箱即用。

更新：free jqGrid 4.8 中不再存在游标在不可排序列上的问题。

【讨论】：

我认为你不能只将cursor:default 添加到 colModel 中吗？（我对 jqGrid 一无所知——只是想知道）
@Adam Terlson：colModel 中的哪些属性可以添加“cursor:default”（参见here）？没有一个适用于列标题。 “classes”属性将应用于<td> 而不是<th> 元素。您无法轻松地为任何<th> 网格重新定义 CSS，因为您只想将“cursor:default”设置为不可排序列。所以我认为没有非常简单的方法可以做到这一点，但我建议的只是几行代码就可以了。
非常感谢 Oleg，它工作得非常好。感谢其他人的快速回复。
为什么那个小教程是针对我的？你要回答的甚至不是我的问题.... ?
@Mark Pusateri：投票只需点击答案左侧的向上箭头即可。由于很多事情，投票在 stackoverflow 上非常重要。 1) 它将用于排序和搜索引擎（甚至被谷歌）。未投票的答案将被解释为没有帮助，并且在许多情况下找不到。 2）投票是对答案说“谢谢”的形式。具有较高声誉的用户帮助了很多人，您可以更“信任”他的陈述。我建议你阅读FAQs。

【解决方案4】：

Oleg 的示例效果很好，但我要求在列可排序时始终显示箭头。我知道我在评论，但我认为有人可能有相同的要求。

所以我将这个添加到他的循环中：

jQuery('span.s-ico',value.el).remove();

那么在他的代码运行之后：

jQuery(".s-ico").show();

然后将此添加到我的网格创建中：

onSortCol:function(index, iCol, sortorder){
    // redisplay all arrows
    jQuery(".s-ico").show();
}

【讨论】：