是否有一種更優雅的方式來檢測觸摸事件支持並分配「click」或「touchend」事件？

var ClickOrTouchEvent = ("ontouchend" in document.documentElement ? "touchend" : "click"); 

$("#MyButton").on(ClickOrTouchEvent, function() { 
    // Do something 
});

這可行，但可能有更優雅的方式來檢測觸摸事件支持並分配「click」或「touchend」事件。是否有一種更優雅的方式來檢測觸摸事件支持並分配「click」或「touchend」事件？

來源

2013-01-10 Shane

有很多插件，人們已經創建，以添加更多的高級觸摸支持他們的基於jQuery的網絡應用程序，如拖放。你可以使用其中的一種，而不是試圖製造自己的。

這就是說，他們似乎都有我的經驗中的奇怪問題，所以你可能不得不嘮叨。看起來你的解決方案和他們大多數人在同一個家族裏。這裏有幾個流行的插件和他們所使用的解決方案，來決定觸摸或點擊：

TouchPunch增加了觸摸到的一切，像這樣：

// Detect touch support and save it in support 
    $.support.touch = 'ontouchend' in document; 

    // Ignore browsers without touch support 
    if (!$.support.touch) { 
    return; 
    } 
//rest of plugin code follows

jquery-ui-for-ipad-and-iphone有你要調用添加觸摸事件的方法期望的元素...但只有當瀏覽器支持它。如果我不使用jQuery UI什麼東西

$('Element').dialog().addTouch();

來源

2013-01-10 22:19:18

，我只是想直線上升的Javascript/jQuery的解決方案：

// Same deal. Detect touch support and save it in support $.extend($.support, { touch: "ontouchend" in document }); // // Hook up touch events // $.fn.addTouch = function() { if ($.support.touch) { this.each(function(i,el){ el.addEventListener("touchstart", iPadTouchHandler, false); el.addEventListener("touchmove", iPadTouchHandler, false); el.addEventListener("touchend", iPadTouchHandler, false); el.addEventListener("touchcancel", iPadTouchHandler, false); }); } }; ....

然後調用addTouch應用上使用jQuery UI功能的要素是什麼？ – Shane

然後我認爲你的解決方案很好。我試圖指出的是，一些非常流行的框架以與你相同的方式測試觸摸兼容性。唯一的區別是他們使用jquery.support和一些更高級的init。 –

我不建議檢測觸摸事件*支持*。相反，最好檢測是否使用了觸摸事件*（例如，禁用touchstart上的點擊處理器效果）。檢測觸摸支持的問題在於，瀏覽器可能同時支持觸摸和鼠標（例如，具有觸摸屏的筆記本電腦），或者甚至聲稱支持非觸摸設備上的觸摸事件。 – hayavuk

是否有一種更優雅的方式來檢測觸摸事件支持並分配「click」或「touchend」事件？

回答

相關問題