在復雜交互場景中,合理運用 preventDefault
可以幫助我們更好地控制和處理用戶事件
event.preventDefault()
來阻止默認行為。document.querySelector('a').addEventListener('click', function(event) {
event.preventDefault(); // 阻止默認行為
// 自定義處理邏輯
});
event.stopPropagation()
或者 event.preventDefault()
(取決于具體需求)來阻止事件冒泡。document.querySelector('.child').addEventListener('click', function(event) {
event.stopPropagation(); // 阻止事件冒泡
// 或者 event.preventDefault(); 根據需求選擇
// 自定義處理邏輯
});
event.preventDefault()
和 event.stopPropagation()
。document.querySelector('input[type="submit"]').addEventListener('click', function(event) {
event.preventDefault(); // 阻止默認行為
event.stopPropagation(); // 阻止事件冒泡
// 自定義處理邏輯
});
document.querySelector('input[type="text"]').addEventListener('keydown', function(event) {
if (event.key === 'Enter') {
event.preventDefault(); // 阻止默認行為,例如表單提交
// 自定義處理邏輯
}
});
總之,在復雜交互場景中,合理運用 preventDefault
可以幫助我們更好地控制和處理用戶事件。我們需要根據實際需求和場景來決定何時使用 preventDefault
,以及如何使用它。