JS阻止默认事件行为
event.preventDefault();
是 JavaScript 中用于阻止默认事件行为的一个方法。当在事件处理函数中调用此方法时,它会告诉浏览器不要执行与该事件关联的默认动作。例如,对于一个点击链接的事件,默认行为是导航到链接的 href
地址;对于表单提交事件,默认行为是提交表单并刷新页面。
使用 event.preventDefault();
可以让你自定义事件的行为,而不是使用浏览器提供的默认行为。这对于创建动态和响应式的 Web 应用程序特别有用。
示例一:href行为
<a id="myLink" href="https://example.com">Click me</a> <script> document.getElementById('myLink').addEventListener('click', function(event) { event.preventDefault(); // 阻止默认行为(即不跳转至链接地址) console.log('Link was clicked but default action is prevented.'); }); </script>
示例二:表单默认提交
<form id="myForm"> <input type="submit" value="Submit form"> </form> <script> document.getElementById('myForm').addEventListener('submit', function(event) { event.preventDefault(); // 阻止默认行为(即不提交表单) console.log('Form submission was prevented.'); // 在这里可以添加 AJAX 请求等代码来异步处理表单数据 }); </script>