Question

我实际上是将我的网站调整为移动设备并遇到问题：我将某些功能用作悬停事件作为“触发器”。而现在我不知道如何将悬停事件转换为移动幕后的事件。我知道我的插件中的taphold事件（jquery finger）但是只触发一次并且没有告诉龙头何时停止保持。我需要类似的东西：

$("selector").on("as long as tap is hold", function () {

});

对于另一种情况我需要类似的东西，唯一的区别是我想要类似于“mouseleave”的东西 - 仅用于移动设备（当用户不再拥有时）。

最后但同样重要的是，它也适用于委派活动。

jQuery的：

var myInterval;
var i = 0;
var link;
$(".postimagepic").hover(function () {
    link = $(this).attr("src");
    i = 0;
    myInterval = setInterval(function () {
        $.ajax({
            url: 'somephp.php',
            type: 'post',
            data: {
                'user':'loooook',
                'topost':link
            },
            success: function() {

            }
        });
        i++;
        if(i == 30) {
            clearInterval(myInterval);
        }
    }, 1000);
}, function () { //That´s why I need to know when not holding anymore
    clearInterval(myInterval);
});

Answer 1

jQuery hover()方法只是简写：

$( selector ).mouseenter( handlerIn ).mouseleave( handlerOut );

反过来，mouseenter()和mouseleave()都是

的缩写

.on( event, handler )

所以你应该可以这样做：

var myInterval;
var i = 0;
var link;
var postimagepic = $(".postimagepic");

var doAjax = function() {
    link = postimagepic.attr("src");
    i = 0;
    myInterval = setInterval(function () {
        $.ajax({
            url: 'somephp.php',
            type: 'post',
            data: {
                'user':'loooook',
                'topost':link
            },
            success: function() {

            }
        });
        i++;
        if(i == 30) {
            clearInterval(myInterval);
        }
    }, 1000);
};

// handle both touch and mouse events
postimagepic.on("mouseenter touchstart ontouchstart", doAjax())
            .on("mouseleave touchend ontouchend", function () { 
                clearInterval(myInterval);
            });

由于touchstart和touchend支持是shakey，我建议使用某种类型的帮助程序库，如JQuery Mobile，它可以在所有浏览器中提供规范化事件。

Answer 2

我相信jQuery v1.7 +可以访问这些（以及其他）移动触摸事件：

的 tapstart

用户开始触摸元素时触发（或点击，用于桌面环境）。

<强> tapend

用户从目标元素释放手指后触发（或在桌面上释放鼠标按钮）。

taphold

只要用户点击并按住
，就会触发此事件目标元素至少750毫秒。

因此，您需要将tapstart和tapend结合使用。如果您询问是否可以在tapend上终止Ajax请求，那么这是不可能的。一旦提出请求，就已经完成了。但是，您可以在Ajax回调中检查某个变量是否设置为true / false，该变量由tapend事件设置。

示例：

//Flag to be set upon touchend event: var touchEnded = false; //** Handle TouchStart **// $("selector").on('touchstart', function() { //doAjax(callback) callback = function(res) { if (touchEnded) { return false; } else { //do logic } } }); //** Handle TouchEnd **// $("selector").on('touchend', function() { touchEnded = true; });

只要点击持有就发送ajax - 如果点击不持久 - 请不要ajax

2 个答案: