`
wangyanlong0107
  • 浏览: 504977 次
  • 性别: Icon_minigender_1
  • 来自: 沈阳
社区版块
存档分类
最新评论

【转】链接中的href与onclick执行js的区别

    博客分类:
  • js
 
阅读更多

1. 链接的 onclick 事件被先执行,其次是 href 属性下的动作(页面跳转,或 javascript 伪链接);
2. 假设链接中同时存在 href 与 onclick,如果想让 href 属性下的动作不执行,onclick 必须得到一个 false 的返回值。不信,你可以将 goGoogle 函数中的 return false 注释掉;
3. 如果页面过长有滚动条,且希望通过链接的 onclick 事件执行操作。应将它的 href 属性设为 javascript:void(0);,而不要是 #,这可以防止不必要的页面跳动;
4. 如果在链接的 href 属性中调用一个有返回值的函数,当前页面的内容将被此函数的返回值代替
5. 在按住Shift键的情况下会有所区别。
6. 今天我遇到的问题,在IE6.0里以href的形式访问不到parentNode。
7. 尽量不要用javascript:协议做为A的href属性,这样不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。

就这些,花了不少时间在这上面。

[缘由]
用CheckBoxList控件时想实现在每个checkbox后再加链接的功能,点链接实现一些功能之外,还要把checkbox选中。

<input type=”checkbox” name=”chk” id=”chk”>
<label for=”chk”>选中它<a onclick=”this.parentNode.click();” href=”#” style=”border:solid 1px blue;”>[label中的链接]</a></label>

最后用parentNode来实现的。

分享到:
评论

相关推荐

    a标签的href与onclick事件的区别详解

    也就是说,用户点击链接后,首先会触发`onclick`绑定的JavaScript函数,执行完毕后再执行`href`指定的动作,如页面跳转或者执行JavaScript代码。 2. **阻止默认行为**: 如果希望在`onclick`执行后阻止`href`的...

    详解Html a标签中href和onclick用法、区别、优先级别

    综上所述,`href`和`onclick`在`&lt;a&gt;`标签中分别负责链接跳转和JavaScript交互。在设计交互时,要根据需求选择合适的属性,并注意事件处理的顺序和阻止默认行为,以确保在不同浏览器中保持一致的行为。在需要传递`...

    html超链接a标签的href跳转跟onclick之间执行顺序示例介绍

    如描述中所述,`onclick`事件和`href`跳转之间的执行顺序是这样的:首先,`onclick`事件的JavaScript代码会被执行。如果`onclick`函数返回`false`,则浏览器将阻止默认的`href`跳转行为,即不会导航到`href`属性指定...

    a标签的href和onclick 的事件的区别介绍

    `href`和`onclick`都是与`&lt;a&gt;`标签交互相关的属性,但它们的作用和执行顺序有所不同,理解这些差异对于优化用户体验和控制页面行为至关重要。 首先,`href`属性是`&lt;a&gt;`标签的核心属性,它定义了链接的目标地址。当...

    A标签中通过href和onclick传递的this对象实现思路

    在JavaScript中,`&lt;a&gt;`标签常常用于链接到其他页面或者执行某些JavaScript操作。当涉及到在`&lt;a&gt;`标签上同时使用`href`属性和`onclick`事件时,`this`对象的行为可能会变得复杂,特别是在想要传递当前元素引用给一个...

    空链接 href="#"与href="javascript-void(0)"的区别.docx

    ### 空链接 `href="#"` 与 `href="javascript:void(0)"` 的区别 在Web开发中,经常会遇到需要创建空链接的情况,这些链接主要用于页面内的导航或者是触发某些JavaScript事件,而不是真正的跳转到另一个页面。在HTML...

    a标签href属性与onclick事件使用实例

    在`&lt;a&gt;`标签中,`onclick`事件可以用来执行JavaScript代码,包括页面跳转。例如: ```html &lt;a onclick="window.location.href='https://www.jb51.net'"&gt;我们 ``` 这里,点击"我们"后,JavaScript代码`window....

    a标签中调用js中的方法的方法

    - 避免了直接在`href`中执行JavaScript代码所带来的问题。 - **缺点**: - 相对于其他方法,代码略显冗余。 3. **`&lt;a href="javascript:;" onclick="js_method();"&gt;`** - **描述**: 类似于第二种方法,但执行一...

    javascript实现删除前弹出确认框

    比如,当删除操作关联到某个链接或按钮时,我们可以直接在该元素的`onclick`事件处理器中调用`del()`函数,并根据函数返回的布尔值来决定是否执行删除操作。例如: ```html &lt;a href="***" onclick="return del();"&gt;...

    a标签href属性和onclick事件的比较介绍

    首先说一下, href属性 和 onclick事件 的执行顺序,当鼠标点击a标签的时候会先执行 onclick事件, 然后才是 href 属性下的动作(页面跳转,或 javascript 伪链接),如果不想执行href 属性下的动作执行,onclick ...

    jquery A标签onclick事件

    3. **JavaScript 函数引用问题**:在实际应用中,直接传递字符串 `"GetServer(this)"` 作为 `onclick` 属性值的方式并不是最佳实践,因为这会导致每次点击时重新创建函数。推荐使用标准的事件绑定方法。 综上所述,...

    a href=javascript void(0) 是什么意思呢?加不加上有什么区别?.docx

    #### 三、`a href="#"` 与 `a href="javascript:void(0)"`的区别 1. **`#` 的含义**:在`a`标签中,`href="#"`通常表示链接到当前页面内的某个位置(通过ID锚点实现)。当没有指定具体ID时,点击该链接会使页面滚动...

    html中a标签调用js函数.docx

    " onclick="js_method()"&gt;`),而阿里巴巴主页使用了第一种方法,但它们都对每个`href`中的JavaScript方法进行了`try-catch`封装,以处理可能的异常。 **JavaScript编码规范和注意事项**: - 字符类型`char`的值...

    a标签的学习总结

    1. **链接的事件顺序**:当你点击一个`&lt;a&gt;`标签时,首先触发的是`onclick`事件处理程序,然后才是`href`属性指定的行为,如页面跳转或执行JavaScript代码。如果`onclick`事件返回`false`,`href`的行为将会被阻止。 ...

    ie6下a标签的onclick事件不执行问题解决方案

    在IE6中,当`&lt;a&gt;`标签的`href`属性被设置为`javascript:void(0)`或者空字符串时,浏览器会尝试阻止默认的页面跳转行为,以便执行`onclick`事件中的JavaScript代码。然而,IE6的事件处理机制并不完善,它有时无法正确...

    在JS中a标签加入单击事件屏蔽href跳转页面

    我们常用的在a标签中有点击事件: ...W3C标准不推荐在href里面执行javascript语句 2. a href=[removed]void(0); onclick=js_method() 这种方法是很多网站最常用的方法,也是最周全的方法,onclick方法负责执行

Global site tag (gtag.js) - Google Analytics