下拉不會在iPad上消失

我有一個簡單的下拉按鈕，它顯示用戶點擊或點擊（在觸摸屏上）按鈕時的內容。它運行良好，但在一些移動設備上（特別是iPad和帶有Windows Mobile的設備），當用戶觸摸下拉菜單之外的屏幕時，下拉不會消失。下拉不會在iPad上消失

這裏的HTML：

<div class="dropdown"> 
    <div class="dropdown-toggle">Click Me</div> 
    <div class="dropdown-menu">Example contnt of the dropdown</div> 
</div>

這裏的JavaScript：

$(document).on('mouseenter', '.dropdown', function() { 

    $(this).children('.dropdown-menu').show(); 

}).on('mouseleave', '.dropdown', function() { 

    $(this).children('.dropdown-menu').hide(); 

});

爲什麼不能在這些設備上工作？
我應該使用哪些其他活動？
而最重要的是：如何讓所有設備上的下拉菜單正常消失？跨瀏覽器和跨設備解決方案將非常棒。

來源

2015-10-01 zitix

的touchstart事件添加到以下

$(document).on('mouseenter touchstart', '.dropdown', function() {

同樣地，在touchend事件沒有'mouse'事件（除了'點擊'，還有，'click'事件比'touch'事件慢）在移動設備上（android，ios）。我建議使用'hammer.js'作爲跨平臺 –

您可以在鼠標移開

}).on('mouseleave touchend', '.dropdown', function() {

來源

2015-10-01 21:13:19

它是跨瀏覽器的解決方案嗎？ – zitix

@ zitix，是的，這應該與大多數瀏覽器兼容。 –

下拉不會在iPad上消失

回答

相關問題