問題描述
當使用委托給一個非button、a標簽元素添加click
事件時,如果事件是委托到 document
或 body
上,並且委托的元素是默認不可點擊的(如 div
, span
等),此時 click
事件會失效。
解決辦法
解決辦法有 4 種可供選擇:
- 將
click
事件直接綁定到目標元素(即.target
)上 - 將目標元素換成
<a>
或者button
等可點擊的元素 - 將
click
事件委托到非document
或body
的父級元素上 - 給目標元素加一條樣式規則
cursor: pointer;
推薦后兩種。從解決辦法來看,推測在 safari 中,不可點擊的元素的點擊事件不會冒泡到父級元素。通過添加 cursor: pointer
使得元素變成了可點擊的了。