ios手機訪問H5頁面中$(document).on綁定無效問題

1.問題描述

用amazeUI做了個手機端網站，網站頭部是一個點擊按鈕下拉菜單，點擊頁面其余區域下拉菜單隱藏。在chrome模擬安卓和iOS都可以正常觸發，但是在真機實測的時候，iOS上面失效了。簡單代碼描述如下

    $(document).on("click", function (e) {
        $("#collapse-head").css("display", "none")
    });

function里面的代碼不會執行。

 

2.解決

查閱信息后，說是iphone這些元素上沒有click事件，它是touch事件

（1）有一個解決方法是給需要綁定事件的元素添加一個css cursor: pointer 。 
body{ 
cursor:pointer; 
} 

（2）或者將click改為touchstart事件，或者共存 

　　

$(document).on(“click touchstart”, “.name”, function() { 
    $("#collapse-head").css("display", "none")
});