Question

我有一个dgrid表，其选择模式为 toggle 。我的一个要求是在行上实现双击以触发函数。

这就是我所拥有的：

grid.on('.dgrid-content .dgrid-row:dblclick', function () {
    window.alert('Hello world!');
});

问题是，双击也会导致selection events dgrid-select和dgrid-deselect触发，因为它还会注册两次单击以进行选择。

我尝试添加此代码，但它无法按预期工作：

var timer;

grid.on('.dgrid-content .dgrid-row:click', function (event) {
    var row = this;
    if (timer) {
        event.preventDefault();
        event.stopPropagation();
        event.stopImmediatePropagation();
        clearTimeout(timer);
    } else {
        timer = window.setTimeout(function() {
            // something to make the click go through?
            row.emit('something here');
            clearTimeout(timer);
        }, 250);
    }
});

有没有办法实现这个目标？

我已经咨询了How to use both onclick and ondblclick on an element?，但那里的答案似乎并不适合我。

我也查看了misc实用程序，也许它是我需要的debounce函数，但我不知道如何使用它。

Answer 1

您可以使用Dgrid类中的函数row和cell ：

 define([
     "dojo/_base/declare",
     "dojo/_base/lang", // hitch
     "dgrid/OnDemandGrid"
 ], function (declare, lang, OnDemandGrid){
     return declare(OnDemandGrid, {

         _onSingleClickAction: function (event) {
             var row = this.row(event), // dgrid/Grid methods
                 cell = this.cell(event);

             /********************
             * WORKING WITH DATA *
             ********************/
         }, // _onSingleClickAction

         _onDblClickAction: function (event) {
             var row = this.row(event), // dgrid/Grid methods
                 cell = this.cell(event);

             /********************
             * WORKING WITH DATA *
             ********************/
         }, // _onDblClickAction

         postCreate: function () {
             this.inherited(arguments);

             this.on(".dgrid-content .dgrid-row:dblclick", lang.hitch(this, "_onDblClickAction"));
             this.on(".dgrid-content .dgrid-row:click", lang.hitch(this, "_onSingleClickAction"));
         } // postCreate
     }); // declare
 }); // define

最终类别定义：

 define([
     "dojo/_base/declare",
     "dojo/_base/lang", // hitch
     "dgrid/OnDemandGrid"
 ], function (declare, lang, OnDemandGrid){
     return declare(OnDemandGrid, {

         onDblClick: function (row) {  // empty method for definition in childs
             console.log(row.id);      // record id from the store
             console.log(row.data);    // full object from the store
             console.log(row.element); // DOM element
         },

         _onDblClick: function (event) { // private method
             this.onDblClick(this.row(event)); // extract data from event
         }, // _onDblClick

         postCreate: function () {
             this.inherited(arguments);

             this.on(".dgrid-content .dgrid-row:dblclick", lang.hitch(this, "_onDblClick"));
         } // postCreate
     }); // declare
 }); // define

[1] https://github.com/SitePen/dgrid/blob/v1.2.1/doc/usage/Working-with-Events.md

dgrid行和双击事件

1 个答案: