`
Y.S.Z
  • 浏览: 1978 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

href="javascript:xxx(this);"和onclick="javascript:xxx(this);"的区别

阅读更多

href="JavaScript:xxx(this);"和onclick="javascript:xxx(this);"

一直以为这两种写法是等同的,今天在项目中使用时发现前者的this根本拿不到触发事件的A标签,而后者可以拿到

一般在做分页按钮时会用A标签来做,但是一般都会写<a href="#" onclick="turnPage(1,10)">之类的

href="#"会导致分页在跳转时页面先跳到当前页面顶部用户体验不好,所以一般推荐写成

<a href="javascript:void(0);" onclick="turnPage(1,10,this)">

甚至如果跳转的方法不需要拿到当前的A标签this的话,也可以直接写成

<a href="javascript:turnPage(1,10);" >

 

示例代码:

<div id="sse">
       <a href="javascript:WebSocketTest(this)">运行 WebSocket</a>
	<a href="javascript:void(0);" onclick="javascript:WebSocketTest(this)">运行 WebSocket(2)</a>
</div>
<script type="text/javascript">
	function WebSocketTest(obj){
		console.log(obj.innerText);
	}
</script>

 

分享到:
评论

相关推荐

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

    2. **参数传递**:`onclick`可以传递`this`作为参数,允许在函数内部访问触发事件的元素,而`href="javascript:xxx()"`方式无法传递`this`。例如: ```html &lt;a href="javascript:void(0)" onclick="showElement...

    程序员常用代码小技巧_javascript.doc

    * 对象绑定事件:`document.all.xxx.detachEvent('onclick',a)` * 插件数目:`navigator.plugins` * 取变量类型:`typeof($js_libpath) == "undefined"` 下拉框 * 下拉框:`下拉框.options[索引]` * 下拉框项数:`...

    html提交图片

    &lt;INPUT type="image" height="19" width="53" src="xxx.gif" align="absMiddle" border="0" name="RedImg" onclick="this.form.submit()"&gt; ``` 此代码创建了一个点击后可以提交表单的图片按钮。其中 `src` 属性指定...

    JavaScript中一些常用的小技巧

    在JavaScript编程中,掌握一些常用的小技巧可以极大地提高开发效率和代码质量。以下是一些从网络上整合的实用技巧,特别适合初学者学习。 1. 事件源对象:`event.srcElement` 可以获取触发事件的元素,而 `event....

    javascript技巧大全

    ### JavaScript技巧大全 ... &lt;a href="javascript:void(0)" onclick="return false;"&gt;Link ``` 通过以上技巧的学习,开发者可以更加熟练地使用JavaScript来处理各种场景下的需求,提高开发效率和用户体验。

    javascript 代码大全

    JavaScript是Web开发中不可或缺的一部分,它提供了丰富的功能来操作网页元素和处理用户交互。这篇“JavaScript代码大全”详细讲解了JavaScript中的常用对象及其用法,下面将深入探讨这些知识点。 1. **事件源对象**...

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

    这个标签有两个主要属性:href和onclick。href属性用于指定链接的目标地址,而onclick属性则用于绑定一个事件处理器,当用户点击标签时会触发相应的JavaScript代码执行。理解这两个属性的使用场景和区别,对于前端...

    Javascript小技巧一箩筐

    标题和描述中提到的知识点包含了很多JavaScript编程中的高级技巧和实用方法,涵盖了事件处理、DOM操作、字符串处理、CSS操作等多个方面。以下是对给定内容中知识点的详细解释: 1. 事件处理: - `event.srcElement...

    js使用小技巧

    Javascript小技巧一箩筐 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcElement.releaseCapture(); 事件按键 event.keyCode ...

    javascript实用代码大全

    在本篇文章中,我们将详细介绍与JavaScript相关的实用代码片段和技术要点,这些内容将帮助开发者更好地理解和应用JavaScript中的各种特性。根据提供的文件信息,我们可以从中提炼出以下关键知识点: #### 1. 事件...

    图片做提交按钮和重置按钮编程技术

    &lt;input type="image" height="19" width="53" src="xxx.gif" align="absMiddle" border="0" name="RedImg" onClick="this.form.submit()"&gt; ``` - ```html &lt;input type="image" height="19" width="53" src="xxx....

    javascript小技巧.doc

    JavaScript是一种广泛应用于网页和网络应用开发的脚本语言,它主要在用户端浏览器运行,用于增加交互性和动态功能。以下是一些JavaScript的小技巧和常见用法: 1. **事件源对象**:`event.srcElement` 提供了触发...

    thymeleaf的th标签

    th:inline 标签用来定义 js 脚本可以使用变量,例如:&lt;script type="text/javascript" th:inline="javascript"&gt;... th:action th:action 标签用来表单提交的地址,例如:&lt;form action="subscribe....

    JS 大全 JS JS

    JavaScript(简称JS)是Web开发中的重要脚本语言,用于实现客户端交互和动态网页效果。在文档中,我们看到了很多关于JS操作的细节,这里将它们分门别类进行详细解释: 1. **事件处理**: - `event.srcElement.tag...

    javascript小技巧

    - `document.all.xxx.detachEvent('onclick', a)`:移除指定的事件监听器。 #### 浏览器功能 1. **插件检测**: - `navigator.plugins`:返回一个数组,包含浏览器中安装的所有插件的信息。 2. **类型检测**: ...

    JavaScript 技巧雜匯.pdf

    - **`document.all.xxx.detachEvent('onclick',a);`**:移除指定事件的监听器。 ##### 18. 插件数量 - **`navigator.plugins`**:获取浏览器安装的插件信息。 ##### 19. 获取变量类型 - **`typeof($js_libpath)=...

    [removed].href IE下跳转失效的解决方法

    在现代浏览器中,通常不需要这样的特殊处理,因为它们对JavaScript事件和页面导航的处理更加智能。在实际开发中,为了确保跨浏览器的兼容性,开发者应测试多种浏览器环境,选择适合项目需求的解决策略。同时,随着...

Global site tag (gtag.js) - Google Analytics