pointer-events: none——CSS实现禁用鼠标点击事件！巧妙解决ExtJs表格单行禁用功能！

注：该篇更好的解决方案见：【解决方案】Ext.grid.CheckboxSelectionModel 实现锁住指定行不被选中

需求如下：



实现效果如下：



注：深灰色的背景色丑是丑了点，但是也正是这样才让前面的勾选框看上去不存在，实际上这个checkbox还是存在的，只是颜色正好被覆盖了。

实现方法如下：

js中，对表格的 viewConfig 属性进行 getRowClass 判断设置：

viewConfig: {
forceFit: false,
getRowClass:function(record,index,rowParams,store){

                if (record.data.status == "startCatalog") {

                    return "getRowClassLock";

                }
}

},

css中，对返回的样式进行设置，此处就完美地应用 pointer-events: none实现鼠标点击无效的功能！

.getRowClassLock {

      background-color: #999;

      pointer-events: none;

}