JavaScript制止变乱冒泡和默认行为的方法举例

目录

• 默认行为
• 制止默认行为
• 1. 使用event.preventDefault()方法：
• 2. 使用return false：
• 3. 使用event.returnValue属性：
• 4. 使用event.stopPropagation()方法（仅制止变乱流传）：
• 5. 使用 cancelable 属性
• 6. defaultPrevented 方法
• 变乱冒泡
• 制止变乱冒泡
• event.stopPropagation()
• 总结 

默认行为

在JavaScript中，变乱默认行为是指在特定的变乱发生时浏览器主动实行的操作。例如，当用户单击一个链接时，浏览器会主动跳转到链接的URL页面；form 元素 的 action 属性值表单内容要提交的地址，而用户点击表单位素中嵌套的提交按钮时，就会有一个默认的提交操作。

而偶然候，不需要这些默认行为。好比，我们提交表单盼望ajax 异步发送到服务器，不需要form 的默认变乱提交跳转行为。

制止默认行为

1. 使用event.preventDefault()方法：

这是制止变乱默认行为最常用的方法之一。当变乱被触发时，可以调用[code]event.preventDefault()[/code]方法来制止浏览器实行其默认行为。例如，在单击链接时，可以通过以下方式制止浏览器跳转到链接的URL页面：

2. 使用return false：

在某些情况下，可以在变乱处理步调中使用[code]return false[/code]来制止变乱默认行为。这种方式通常用于内联变乱处理步调，例如[code]onclick[/code]属性。例如，以下代码将制止单击链接时的默认行为：

3. 使用event.returnValue属性：

在旧版本的IE浏览器中，可以使用[code]event.returnValue[/code]属性来制止变乱默认行为（如今很多浏览器也支持）。将[code]event.returnValue[/code]设置为[code]false[/code]可以制止默认行为的实行。例如：

4. 使用event.stopPropagation()方法（仅制止变乱流传）：

制止变乱流传。 [code]event.stopPropagation()[/code]方法用于制止变乱的进一步流传，而不是直接制止变乱的默认行为。它可以用于停止变乱冒泡到父元素或其他变乱监听器。例如：

5. 使用 cancelable 属性

检察状态。 该属性表现变乱是否可以取消，返回一个布尔值。该属性是只读属性。true 表现可以取消。

6. defaultPrevented 方法

检察状态。 也是 event的一个属性，表现默认行为是否被制止，true 表现被制止。

需要注意的是，不同的变乱有不同的默认行为，因此制止默认行为的方法可能会有所不同。一些常见的变乱默认行为包罗表单提交、链接点击、表单位素的键盘输入等。

总结起来，使用[code]event.preventDefault()[/code]方法是最常见和保举的制止变乱默认行为的方法。其他方法如[code]return false[/code]和[code]event.returnValue[/code]属性在特定情况下可能有效，但不如[code]event.preventDefault()[/code]方法灵活和通用。另外，[code]event.stopPropagation()[/code]方法用于制止变乱流传，而不是直接制止变乱的默认行为。

变乱冒泡

变乱冒泡是指当⼀个⼦元素触发了某个变乱后，变乱会⼀直冒泡到它的⽗元素，直到到达⽂档根节点。

制止变乱冒泡

event.stopPropagation()

总结 

到此这篇关于JavaScript制止变乱冒泡和默认行为的文章就先容到这了,更多相干JS制止变乱冒泡和默认行为内容请搜索脚本之家从前的文章或继续浏览下面的相干文章盼望各人以后多多支持脚本之家！