如何在按下回车键时获取SlickGrid中高亮行的行号？

核心问题原因 #

• 原代码onKeyDown事件订阅存在语法错误，缺少闭合括号，直接导致事件绑定失效
• getCellFromEvent是专门针对鼠标/触摸类事件设计的API，通过事件坐标定位单元格，键盘事件没有对应坐标信息，调用后只会返回null无法获取行号
• 事件绑定顺序错误：行选择模型的初始化在键盘事件绑定之后，导致getSelectedRows()无法正常返回选中行数据
• getSelectedRows()返回的是选中行的索引数组，即便是单选模式也需要取数组第一个元素才能拿到有效行号
• 未阻止回车键默认行为，可能触发页面其他默认交互（比如表单提交）干扰事件执行

修正后完整代码 #

var grid;
function ttesting(){
    var data=[];    
    load_text_resource(descsource); 
    grid = new Slick.Grid("#myGrid", data, columns, options);
    grid.invalidate();

    // 从多维数组加载数据
    for (var i = 0; i < maxdesc-2; ++i) {
        data[i] = {
            aName: descarray[i][2] + " " + descarray[i][3] + descarray[i][4] + descarray[i][5] + descarray[i][6],
            aTitle: descarray[i][8],
            aDesc:descarray[i][9]        
         }; 
    }
    grid.setOptions(options);

    // 鼠标双击事件原有逻辑保持不变
    grid.onDblClick.subscribe(function(event) {    
        var cell = grid.getCellFromEvent(event),
        row = cell.row; 
        alert(descarray[row][10]);
    });

    // 先初始化行选择模型，再绑定键盘事件
    grid.setSelectionModel(new Slick.RowSelectionModel());  

    // 修正后的键盘事件处理器
    grid.onKeyDown.subscribe(function(event) {
        // 仅响应回车键
        if (event.keyCode == 13) {
            // 阻止默认行为避免干扰
            event.preventDefault();
            event.stopPropagation();
            // 获取选中行数组
            var selectRows = grid.getSelectedRows();
            // 判空避免未选中行时报错
            if(selectRows.length > 0){
                var row = selectRows[0];
                alert(descarray[row][10]);
                // 此处可直接使用row变量作为行号引用数组元素
            }
        }
    });
    grid.render();
}

修改后按下回车键时会直接读取当前高亮选中的行号，无需通过单元格定位，完全符合仅获取行号引用数组元素的需求。

内容的提问来源于stack exchange，提问作者krasnit