JavaScript阻止事件

yanlan92

已于 2022-03-30 14:33:19 修改

阅读量654

点赞数

文章标签： javascript

于 2022-03-29 19:04:54 首次发布

本文链接：https://blog.csdn.net/sinat_20203869/article/details/123829260

版权

阻止冒泡事件

点击li元素的时候不触发ul的事件。

<html>
    <head>
        <meta charset=utf-8>
    </head>
    <body>
        <ul>
            <li></li>
        </ul>
    </body>
    <script type="text/javascript">
        let li = document.getElementsByTagName('li')[0]
        li.addEventListener('click', function(e) {
            e.stopPropagation()
        })
    </script>
</html>

阻止默认事件

在点击id为"checkbox"的复选框时不会取消勾选状态。

<html>
    <head>
        <meta charset=utf-8>
    </head>
    <body>
        <form>
            <input id="checkbox" type="checkbox" checked />
        </form>
    </body>
    <script type="text/javascript">
        let input = document.getElementById('checkbox')
        input.addEventListener('click', e => {
          e.preventDefault()  
        })
    </script>
</html>