Question

大家好我已经编写了以下代码来查找longpress，当我没有绑定任何数据并尝试给我正确的结果时，它可以正常工作

<div data-options="dxView : { name: 'lngPress', title: 'lngPress' } ">
<div data-options="dxContent : { targetPlaceholder: 'content' } ">
    <div data-bind="event: { mousedown: function() { myFunction() },mouseleave: function() { mymouseleave() },mouseup: function() { mymouseup() } }">
        Mouse over me
    </div>
</div>

我的脚本如下

var longpress = 100;
var start;

testMobileApplication.lngPress = function (params) {
var viewModel = {
    myFunction: function () {
        start = new Date().getTime();
    },
    mymouseleave: function () {
        start = 0;
    },
    mymouseup: function () {
        if (new Date().getTime() >= (start + longpress)) {
            alert('long press!');
        } else {
            alert('short press!');
        }
    }
};

return viewModel;
};

但是当我绑定一些数据时，相同的代码不能按预期工作

<div data-options="dxView : { name: 'lngPress', title: 'lngPress' } ">
<div data-options="dxContent : { targetPlaceholder: 'content' } ">
    <div data-bind="dxList: { dataSource: dataSource }" id="pr">
        <div data-options="dxTemplate: { name:'item' }" data-bind="event: { mousedown: function() { myFunction() },mouseleave: function() { mymouseleave() },mouseup: function() { mymouseup() } }">
            <span class="dx-field-label" data-bind="text: name"></span>
            <span class="dx-field-label" data-bind="text: hire"></span>
        </div>
    </div>
</div>

脚本如下

var longpress = 100;
var start;

testMobileApplication.lngPress = function (params) {
var viewModel = {
    myFunction: function () {
        start = new Date().getTime();
    },
    mymouseleave: function () {
        start = 0;
    },
    mymouseup: function () {
        if (new Date().getTime() >= (start + longpress)) {
            alert('long press!');
        } else {
            alert('short press!');
        }
    },

    dataSource: [
{ id: 1, name: "Bob", hire: 2005 },
            { id: 2, name: "John", hire: 2007 },
            { id: 3, name: "Frank", hire: 2001 },
            { id: 4, name: "Robert", hire: 2007 },
    ]
};

return viewModel;
};

有人可以帮助我

Answer 1

dxList小部件具有特殊回调 itemHoldAction 。您可以使用此回调来处理项目上的hold事件。移动你会得到参数中的项目数据和项目元素。

http://phonejs.devexpress.com/Documentation/ApiReference/Widgets/dxList/Configuration?version=13_2#itemHoldAction

如果你需要保持超时调整，请使用 dxhold 这样的事件：

$("#myElement").on("dxhold", { timeout: 1000 }, function() {
    alert("The element is being held during 1000 milliseconds");
});

http://phonejs.devexpress.com/Documentation/ApiReference/UI_Events?version=13_2#dxhold

希望它会有所帮助。

Knockout js devextreme longpress打开行动表

1 个答案: