on（“ click”，foo）和on（“ touchstart”，foo）在Android與iPhone中引起奇怪的問題

Question

在下面的腳本中，您將在下面找到“ click”和“ touchstart”事件。 最初，這是“單擊”事件，直到我們發現iPhone和iPad不能工作，因為它需要“ touchstart”才能工作。

因此，我將它們都包括在內，因此可以在iPhone / iPad上使用。

然后我遇到了Android問題，其中“ click”和“ touchstart”都被觸發，導致執行兩次。

那么，針對iPhone和Android的此問題的推薦解決方法是什么？

    //Saved Vehicle - Button...
    $(document).on('click touchstart', 'div[id^=RecordViewSheet]', function () {
        var dataVin = $(this).attr("data-vin");
        var dataStockNumber = $(this).attr("data-stock-number");

        ftnThrobblerAnimationBegin3().done(function () {
            httpFormSubmissionPostMethod("InspectionSheet.cshtml", "formStockNumber=" + dataStockNumber + "&formVin=" + dataVin);

            ftnThrobblerAnimationEnd3();
        });
    });

Answer 1

我們在項目中解決類似問題的方式是這樣的

function isMobile(){
    if(typeof window.orientation !== 'undefined') return true;
    return false;
}

var EVENT_CONFIG = {
    CLICK: isMobile()?'touchstart':'click'
}

在您的活動分配中

$(document).on(EVENT_CONFIG.CLICK, 'div[id^=RecordViewSheet]', function () {

關於isMobile函數的說明。

桌面瀏覽器不支持orientation因此我們可以檢測當前瀏覽器是桌面瀏覽器還是移動瀏覽器。

如果undefined window.orientation ，則它是桌面瀏覽器，將不支持觸摸事件。

如果不是，則僅使用觸摸事件。 您在EVENT_CONFIG確定