当前位置: 代码迷 >> Web前端 >> <a/>中href和onclick的差别
  详细解决方案

<a/>中href和onclick的差别

热度:169   发布时间:2013-11-08 17:52:14.0
<a/>中href和onclick的区别
  1. 链接的?onclick?事件被先执行,其次是?href?属性下的动作(页面跳转,或 javascript 伪链接);
  2. 假设链接中同时存在?href?与?onclick,如果想让?href?属性下的动作不执行,onclick?必须得到一个?false?的返回值。
  3. 如果页面过长有滚动条,且希望通过链接的?onclick?事件执行操作。应将它的?href?属性设为?javascript:void(0);,而不要是?#,这可以防止不必要的页面跳动;
  4. 如果在链接的?href?属性中调用一个有返回值的函数,当前页面的内容将被此函数的返回值代替;
  5. 在按住Shift键的情况下会有所区别。
  6. 今天我遇到的问题,在IE6.0里以href的形式访问不到parentNode。
  7. 尽量不要用javascript:协议做为A的href属性,这样不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。
  8. 调用JS时候对参数的处理方式不一致,href会将URL编码的内容自动转码,例如%22将会转成",从而导致被"%22"出现JS错误。
<html>
	<head>
		<script type="text/javascript">
		<!--
		function handler1(arg1){
			alert(arg1);
		}
		-->
		</script>
	</head>
	<body>
		<table width="155">
		<tr>
			<td>
			<div style="height:195;width:157px;overflow:auto;border:1px solid #999999;">
			   <table width="155" border="0" cellspacing="0" cellpadding="0" id="dataTable">
				<tr>
					<a onclick="javascript:handler1('%22%5b%40', 'Y', 'N', 'SAM Report');">TEST</a>.
				</tr>
				<tr>
					<a href="javascript:handler1('%22%5b%40', 'Y', 'N', 'SAM Report');">TEST1</a>
				</tr>	
			   </table>
			</div>
			</td>
		</tr>
		</table>
	</body>
</html>

?

综上所述,当a需要支持JS时比较推荐写法为

<a href="javascript:void(0);" onclick="javascript:fn(this);">

  相关解决方案