以前一直没有想过冒泡，不过今天居然遇到了。
情形是这样的，在我的<a>标签内部只是一个<input type="button">按钮。那么这样我的超链接就失效了。
原代码是这样的：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<a href='http://down.360safe.com/setup.exe' target='_blank'>
<input type='button' class='install_button_yellow' value='立即安装' />
</a>
</body>
</html>
这样我的360.exe是下载不下来的（我说的是IE浏览器）。
后来把代码改为下面这样初步解决了问题。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<a href='http://down.360safe.com/setup.exe' target='_blank'>
<input type='button' class='install_button_yellow' value='立即安装' onclick='window.open(this.parentNode.href);'/>
</a>
</body>
</html>
在这里我用了一下this.parentNode找到其上层节点。这样在IE里面这个问题不存在了。
还好我这个代码只是放在IE里面的。要不然不是要开好多个窗口。郁闷啊。。
当然最好的解决办法是为什么要在<a>标签里面放<button>呢？
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<input type='button' class='install_button_yellow' value='立即安装' onclick='window.open(\"http://down.360safe.com/setup.exe\");'/>
</body>
</html>
分享到：
相关推荐
然后判断这个元素的标签名（`tagName`）是否为"input"且类型为"button"，或者直接是"button"元素。如果条件满足，就执行alert弹出提示，告知用户点击的元素是一个按钮。 如果需要在Google Chrome浏览器中使用上述...
3. **写在外部文件中**：将JavaScript代码存储在一个单独的`.js`文件中，并通过`<script>`标签引用。 ```html <script type="text/javascript" src="some.js"> ``` #### 四、JavaScript基础 1. **与用户交互的...
这涉及到JavaScript的事件处理机制，特别是事件冒泡和事件捕获的概念。事件冒泡是指事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上转播至最不具体的节点（文档）。事件捕获则相反，它...
标题中的“事件委托实例”指的是在编程中，尤其是JavaScript或Web开发中的一种高效处理大量事件的方法。事件委托是基于事件冒泡或事件捕获机制，将事件监听器添加到父级元素而不是每个子元素上，以此来减少内存占用...
HTML元素可能使用`<input>`或`<button>`标签创建，以便用户交互。 2. **CSS美化**： - CSS（层叠样式表）用于样式化计算器的外观，包括颜色、布局和字体等。这可以涉及使用类选择器、ID选择器或伪类来定制按钮的...
在Vue.js中，自定义弹框效果是一种常见的需求，它能够提供更加灵活的用户体验和界面交互。本实例展示了如何在Vue项目中实现一个自定义的弹框组件，该组件可以根据传入的`type`参数来区分是确认框还是提示框。 首先...
`displayDate`函数的定义通常放在`<script>`标签中，或者在外部JavaScript文件中引用。 ```html function displayDate() { document.getElementById("demo").innerHTML = Date(); } ``` 在这个例子中，`...
// 在body内部插入JavaScript代码 document.write("This is an example."); ``` #### 五、JavaScript高级概念 虽然题目中的部分内容提到本教程主要关注基础知识，但在实际应用中，了解JavaScript的高级概念...
- **行内元素**：不会独占一行，如`a`, `span`, `img`, `input`, `button`等。 - **块级元素**：默认情况下会独占一行，如`div`, `p`, `h1`至`h6`, `ul`, `ol`, `dl`, `table`, `form`等。 - **CSS盒模型**：由内容...
JavaScript——DOM DOM，全称为“Document Object Model”，即文档对象模型，是W3C组织定义的一种标准，用于表示HTML或XML文档的结构，并提供了一种程序化访问和操作文档内容的方法。JavaScript作为浏览器端最常用...
- **内联脚本**: 在HTML标签内部直接插入JavaScript代码，例如 `(this)" ...>`。这种方式可以快速响应用户的交互行为。 #### 2. 数据处理与验证 - **身份证号码验证**: - **15位身份证号码升级为18位**: 根据中国...
`this` 关键字在方法内部指向 Vue 实例本身，可以访问到数据对象中的属性。 #### 二、传递参数给方法 有时候我们需要向方法传递参数，这同样可以通过 `v-on` 指令实现。 ```html <button v-on:click="say('hi')...
内部的`<button>`元素提供了关闭弹出层的功能。 接下来，我们需要编写jQuery代码来控制弹出层的显示和关闭。在`<head>`标签中，或者在`<body>`标签的底部添加一个`<script>`标签，写入以下JavaScript代码： ```...
总结来说，Vue.js的事件修饰符和JavaScript的`event.stopPropagation()`提供了阻止事件冒泡的机制，而CSS的`pointer-events`属性则允许我们控制元素是否响应鼠标事件，从而避免事件穿透问题。在实际开发中，根据具体...
当点击`#a`时，如果两个事件处理函数都使用冒泡模型，`#a`的事件处理函数先输出，然后是`#A`的事件处理函数；如果使用捕获模型，则顺序相反。 5. **事件解除绑定** 使用`removeEventListener`方法可以移除已绑定...
3. **样式 (Styles)**：组件可以拥有自己的CSS样式，通过`style`标签或者引入外部CSS文件，确保样式仅在组件内部生效，避免全局样式污染。 ```css h1 { color: blue; } ``` 接下来，我们关注组件间的通信。Vue...
4. **在网页中创建超链接**（第5讲）：学习如何使用`<a>`标签创建内部和外部链接，以及邮件链接、锚点链接等。 5. **表单元素**（第7讲）：表单是用户与网站交互的关键，包括`<form>`、`<input>`、`<textarea>`、`...
1. **直接在标签中写JS方法** ```html <button v-on:click="alert('hi')">执行方法的第一种写法</button> ``` 2. **调用methods** ```html <button v-on:click="run()">执行方法的第二种写法</button> 或 ...
- 表单标签系列：如 `<form>`, `<input>`, `<button>` 等。 - 其他语义化标签：例如 `<header>`, `<footer>`, `<nav>` 等。 3. **页面结构与模块划分** - 网页结构：网页的头部、内容区和尾部的布局。 - 模块...