onclick事件的用法？OnClickListener
各位老铁们好，相信很多人对onclick事件的用法都不是特别的了解，因此呢，今天就来为大家分享下关于onclick事件的用法以及OnClickListener的问题知识，还望可以帮助大家，解决大家的一些困惑，下面一起来看看吧！
详解a标签添加onclick事件的几种方式
我们常用的在a标签中有点击事件：
1. a rel="external nofollow" href="javascript:js_method();" rel="external nofollow"
这种方法在传递this等参数的时候很容易出问题，而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件，在IE里面更会使gif动画图片停止播放。W3C标准不推荐在href里面执行 javascript语句
2. a rel="external nofollow" rel="external nofollow" href="javascript:void(0);" rel="external nofollow" rel="external nofollow" onclick="js_method()"
这种方法是很多网站最常用的方法，也是最周全的方法，onclick方法负责执行js函数，而void是一个操作符，void(0)返回undefined，地址不发生跳转。而且这种方法不会像第一种方法一样直接将js方法暴露在浏览器的状态栏。
3.a rel="external nofollow" rel="external nofollow" href="javascript:;" rel="external nofollow" rel="external nofollow" onclick="js_method()"
这种方法跟跟2种类似，区别只是执行了一条空的js代码。
4.a rel="external nofollow" rel="external nofollow" rel="external nofollow" href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" onclick="js_method()"
这种方法也是网上很常见的代码，#是标签内置的一个方法，代表top的作用。所以用这种方法点击后网页后返回到页面的最顶端。
5.a rel="external nofollow" rel="external nofollow" rel="external nofollow" href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" onclick="js_method();return false;"
这种方法点击执行了js函数后return false，页面不发生跳转，执行后还是在页面的当前位置。
综合上述，在a中调用js函数最适当的方法推荐使用：
a rel="external nofollow" rel="external nofollow" href="javascript:void(0);" rel="external nofollow" rel="external nofollow" onclick="js_method()"
a rel="external nofollow" rel="external nofollow" href="javascript:;" rel="external nofollow" rel="external nofollow" onclick="js_method()"
a rel="external nofollow" rel="external nofollow" rel="external nofollow" href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" onclick="js_method();return false;"
以上所述是小编给大家介绍的a标签添加onclick事件的几种方式详解整合，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
onclick onserverclick,onclientclick的区别和用法
1、OnClientClick是客户端事件处理方法，一般采用JavaScript来进行处理，也就是直接在IE端运行，一点击就运行；
2、OnClick是服务器端事件处理方法，在服务器端也就是IIS中运行，点击后，先执行postback，再运行；
3、OnClientClick常用来做一些客户端的检测。当然也可以放在服务器端检测，但是需要与服务器进行交互，消耗资源，而且用户体验也不好。
当一个控件上同时有OnClick和OnClientClick时，OnClientClick先于OnClick执行
正确的写法应该是：
举例一：<asp:Button ID="btnSave" runat="server" Text="Save" OnClick="btnSave_Click" OnClientClick="return saveFunc();"/>
saveFunc对数据进行验证，当验证通过返回true时，执行服务器端方法进行保存，验证不通过返回false，服务器端的保存方法就不会执行。
错误的写法：
举例二：
<!--无论验证是否通过，都会执行服务器端方法，不能达到验证的目的-->
<asp:Button ID="btnSave" runat="server" Text="Save" OnClick="btnSave_Click" OnClientClick="saveFunc();"/>
举例三：
<!--无论验证结果如何都返回false，服务器端方法永远不会执行-->
<asp:Button ID="btnSave" runat="server" Text="Save" OnClick="btnSave_Click" OnClientClick="saveFunc(); return false;"/>
下面以 HTML的按钮(system.web.ui.htmlcontrols)和 ASP.NET服务端按钮(system.web.ui.webcontrols)为例：
一、 HTML控件，如IMG的输入按钮等的 onclick(客户端)和 onserverclick(服务端)事件，
举例四：
注意 runat="server"
<input type="button" id="btn" name="btn" value="button" runat="server" onserverclick="ServerSideEvent" onclick="SideScript"/>
此处的onclick先于onserverclick执行。
二、WEB控件，如<asp:button按钮等的 onclientclick(客户端)和 onclick(服务端)事件；
举例五：
<asp:Button ID="btn" text="button" runat="server" OnClick="SideScript" OnClientClick="ClientSideScript"/>
此处的onclientclick先于onclick执行。
addEventListener和普通.onclick的区别
addEventListener是在 FireFox上的用法。
addEventListener的参数一共有三个，语法为：
element.addEventListener(type,listener,useCapture)
详解
其中element是要绑定函数的对象。
type是事件名称，要注意的是"onclick"要改为"click","onblur"要改为"blur",也就是说事件名不要带"on"。
listener当然就是绑定的函数了，记住不要跟括号
最后一个参数是个布尔值，表示该事件的响应顺序,下面重点介绍一下addEventListener的第3个参数(useCapture)。
userCapture若为true,则浏览器采用Capture,若为false则采用bubbing方式。建议用false
区别：
varbtn1Obj=document.getElementById("btn1");
//element.addEventListener(type,listener,useCapture);
btn1Obj.addEventListener("click",method1,false);
btn1Obj.addEventListener("click",method2,false);
btn1Obj.addEventListener("click",method3,false);执行顺序为method1->method2->method3
document.getElementById("btn").onclick=method1;
document.getElementById("btn").onclick=method2;
document.getElementById("btn").onclick=method3;如果这样写,那么将会只有medhot3被执行
如果你还想了解更多这方面的信息，记得收藏关注本站。