e.preventDefault（）不是防彈的？

我已經問了一個類似的問題，但沒有得到真正令人滿意的答案，所以我會在這裏再試一次。當我使用這樣的代碼：e.preventDefault（）不是防彈的？

$("#element") .on('click', function() { 
        // do something 
       })    
       .on('touchstart', function(e) { 
        e.preventDefault(); 
        // do the same thing but on touch device like iPad f.e. 
        // and more over PLEASE do not fire the click event also! 
       });

我期待的是，點擊事件是永遠永遠永遠開除（因爲它的瀏覽器應通過事件的工作層次），但事實上，當我觸摸元素讓我們說20次，比單擊事件還會發生一次。爲什麼？

而且我也嘗試了諸如：

$("#element") .on('click', function() { 
        // do something 
       })    
       .on('touchstart', function(e) { 
        e.preventDefault(); 
        e.stopPropagation(); 
        // do the same thing but on touch device like iPad f.e. 
        // and more over PLEASE do not fire the click event also! 
        return false; 
       });

這似乎是有點更加堅實但不防彈。所以我不得不這樣做：

$("#element") .on('click', function() { 
        if (!touchdevice) { 
         // do something 
        }; 
       })    
       .on('touchstart', function(e) { 
        e.preventDefault(); 
        e.stopPropagation(); 
        // do the same thing but on touch device like iPad f.e. 
        // and more over PLEASE do not fire the click event also! 
        return false; 
       });

這似乎是工作，但就是非常愚蠢的，是不是？任何人有想法這是關於什麼？謝謝！

編輯：所以，我真的不得不這樣做：

var touched; 
$("#element") .on('click', function() { 
        if (!touched) { 
         // do something 
        }; 
       })    
       .on('touchstart', function(e) { 
        e.preventDefault(); // actual senseless here 
        e.stopPropagation(); // actual senseless here 
        touched = true; 
        // do the same thing but on touch device like iPad f.e. 
        // and more over PLEASE do not fire the click event also! 
        return false;  // actual senseless here 
       });

來吧傢伙！必須有一個安全的通用方法來在同一個元素上使用touchstart和click事件，以確保點擊事件不會觸發（兩次）以處理觸摸敏感和常規瀏覽器（或者甚至是新的組合觸發器）。你會怎麼做？

來源

2014-09-04 Garavani

我認爲這可能與http://stackoverflow.com/questions/27225577/how-to-prevent-ghost-clicks-on-hyperlinks-when-tapping-on-touch-device嘗試查看是否在點擊元素外部時發生「點擊」。 – aKzenT 2014-12-02 22:35:41

感謝您的評論！看到我自己的答案，看看我到目前爲止做了什麼。 – Garavani 2014-12-04 07:47:55

我期待的是，點擊事件是永遠永遠永遠開除（因爲它的瀏覽器應通過事件的工作層次）[...]

你的even.preventDefault()錯誤的預期。

event.preventDefault()防止瀏覽器針對該元素/事件組合執行的默認操作。例如。提交表單或以下鏈接。它不會阻止執行任何其他事件處理程序。

e.stopPropagation()防止事件冒泡，以便添加到祖先的事件處理程序不會執行。

但是，你不能使用任何的這些方法來防止不同的事件的處理程序來執行，因此，設置標誌，看來確實是這樣做的正確方法。

來源

2014-09-04 17:02:30

謝謝菲利克斯。然而，1）我在一些教程中閱讀了上面的代碼1，以處理點擊和觸摸啓動事件（僅在這一個元素上，顯而易見），以便處理程序不會執行兩次。點擊事件被忽略）2）爲什麼這個組合工作20x，即點擊事件沒有被觸發，只有1x沒有被觸發？奇怪，不是嗎？ 3）我在代碼3中做了一個「標誌」。我認爲這會有所不同。感謝您的耐心和對清除我的想法的興趣！ – Garavani 2014-09-05 04:54:03

現在我用我的網站上最多的地方下面的代碼工作得非常好，可靠：

var flag = false; 
$("#element").on('touchstart click', function() { 
    if (!flag) { 
     flag = true; 
     setTimeout(function() { 
      flag = false; 
     }, 100); // someone else recommended 300 here but I use this value 

     // action here 

    };     
    return false; 
});

PS這不是我發明的，可惜我忘了來源，因爲一些時間已經過去了。

來源

2014-12-04 07:47:08 Garavani

來源似乎是[這個接受的答案]（http://stackoverflow.com/questions/7018919/how-to-bind-touchstart-and-click-events-but-not-respond-to-both）到一個類似的問題。經過更多的時間後我才能找到它。 – Martin 2015-09-28 13:56:50

e.preventDefault（）不是防彈的？

回答

相關問題