Question

以下牵线木偶视图包含一个可通过双击单元格进行编辑的表格。为了实现这一点，我使用了slickgrid。它在chrome中运行良好，但在IE9中，此视图从未注意到更改事件（＆＃34;更改.slick-cell.l1输入＆＃34;）。除非您双击要编辑的单元格进行更改，否则单击保存按钮。在chrome中我可以双击单元格进行更改并点击Enter或单击单元格外的任何位置并进行更改。

DataContentView = Marionette.ItemView.extend({
    className: "ui-widget-content grid-container",

    events: {
        "change .slick-cell.l0 input": "changeDataKey",
        "change .slick-cell.l1 input": "changeDataValue",
        "click .ui-icon-trash": "removeData"
    },

    changeDataValue: function(event){                
        var target = $(event.target),
            key = target.closest(".slick-row").find(".l0").text(),
            value = target.val();

        this.model.set(key, value, {silent:true});
    }
}

Answer 1

"input .slick-cell.l0 input": "changeDataKey",
// and similar to others

如果您的IE版本是＆gt; = 9或'propertychange'事件，请尝试绑定'input'事件。它可以帮助。

Answer 2

使用不同的事件似乎对IE9有效。我发现了我认为可能更好的解决方案。最初，我使用keyup事件来调用changeDataValue函数。除了按下回车键或退出键的情况外，这种方法效果很好。 Slickgrid似乎停止了这些关键事件的传播。为了解决这个光滑的网格有自己的一系列事件。所以我找到了正确的事件onCellChange，这是我使用的代码：

this.grid = new Slick.Grid();       

this.grid.onCellChange.subscribe(function(e,args){
    if(args.cell === 0){//cell in first column changed
        this.changeDataKey(args.item.key, args.item.val);
    }
    else if(args.cell === 1){
        this.changeDataValue(args.item.key, args.item.val);
    }
});

更改事件未在输入元素上触发

2 个答案: