Früher habe ich das href und onclick von sehr beiläufig geschrieben, aber nach ein paar Problemen begann ich, auf dieses Problem zu achten:
Erster Auszug aus einem Dokument:
In Javascript ist void ein Operator, der angibt, einen Ausdruck zu berechnen, aber keinen Wert zurückzugeben.
Das Verwendungsformat des Void-Operators lautet wie folgt:
1. javascript:void (expression) 2. javascript:void expression
Ausdruck ist ein auszuwertender Javascript-Standardausdruck. Die Klammern außerhalb des Ausdrucks sind optional, es empfiehlt sich jedoch, sie zu schreiben. (Implementierungsversion Navigator 3.0)
Sie können den Void-Operator verwenden, um einen Hyperlink anzugeben. Der Ausdruck wird ausgewertet, es wird jedoch nichts in das aktuelle Dokument geladen.
Der folgende Code erstellt einen Hyperlink, der dazu führt, dass dem Benutzer später nichts passiert. Wenn der Benutzer eine Verknüpfung herstellt, wird void(0) als 0 ausgewertet, hat aber keine Auswirkung auf das Javascript.
<A HREF="javascript:void(0)">单此处什么也不会发生</A>
Der folgende Code erstellt einen Hyperlink, der den Benutzer dazu veranlasst, das Formular sofort abzusenden.
<A HREF="javascript:void(document.form.submit())">
Formular hier senden
Der folgende Code führt die Funktion subgo() aus,
<a href="javascript:void(0)" onclick="subgo()">点我</a>
Hier hat javascript:void(0) keine eigentliche Funktion. Es ist nur ein toter Link und die ausgeführte Funktion ist subgo().
点我与<a href="javascript:void(0)" onclick="subgo()">点我</a>区别。
Tatsächlich enthält #eine Standortinformation. Der Standardanker ist #top, also der obere Rand der Webseite, und javascript:void(0) stellt nur eine dar toter Link ohne jegliche Informationen. Daher ist es beim Aufrufen eines Skripts am besten, void(0) zu verwenden
href verweist im Allgemeinen auf eine URL-Adresse, und Sie können auch Javascript aufrufen, z. B. href="javascript: xxx();", Dokument Es wird empfohlen, so zu schreiben: xx, aber diese Methode führt manchmal zu seltsamen Ergebnissen Probleme in komplexen Umgebungen, also versuchen Sie es nicht. Die Verwendung des javascript:-Protokolls als href-Attribut von A führt nicht nur dazu, dass das window.onbeforeunload-Ereignis unnötigerweise ausgelöst wird, sondern führt auch dazu, dass das animierte GIF-Bild im IE nicht mehr abgespielt wird.
Wir wissen, dass das Onclick-Ereignis des Links zuerst ausgeführt wird, gefolgt von der Aktion unter dem href-Attribut (Seitensprung oder Javascript-Pseudolink). Ich möchte die Aktion nicht unter dem href-Attribut ausführen. Für die Aktionsausführung muss onclick false zurückgeben. Im Allgemeinen ist onclick="xxx();return false;".
TabPane's JS-Quellcode: Da onclick kein FALSE zurückgibt, führt das Schließen von TABPANE in IFRMAE zu Problemen bei der Ausführung von href und der Seitenanzeige. Die Lösung besteht darin, den folgenden Code mithilfe von TAB in die JSP zu kopieren.
TabPane.prototype.appendTitle = function(tabpage){ var td = $create("td"); var strHTML = "<table class="" + TAB_STYLE_TABLE + "" border="0" cellspacing="0" cellpadding="0"><tr>"; strHTML +="<td><p class=""+TAB_STYLE_LEFT+""></p></td>"; strHTML +="<td nowarp class=""+TAB_STYLE_MID+"">"; strHTML +="<p style="white-space:nowrap;page-break-before: always;page-break-after: always;">"; strHTML += tabpage.getTitle(); strHTML +="</p></td>"; if(tabpage.showCloseButton){ strHTML +="<td nowarp class=""+TAB_STYLE_MID+"">"; strHTML +="<a class="close" href="#" onclick="$o(\"" + this.id + "\").getTab(\"" + tabpage.id + "\").close(); return false; ">"; if(isIE){ strHTML +="<p></p></a>"; }else{ strHTML +="<p class="close"></p></a>"; } strHTML +="</td>"; } if(tabpage.allowReload){ strHTML +="<td nowarp class=""+TAB_STYLE_MID+"">"; strHTML +="<a class="reload" href="#" onclick="$o(\"" + this.id + "\").getTab(\"" + tabpage.id + "\").reload(); return false; ">"; if(isIE){ strHTML +="<p></p></a>"; }else{ strHTML +="<p class="reload"></p></a>"; } strHTML +="</td>"; } strHTML +="<td><p class=""+TAB_STYLE_RIGHT+""></p></p>"; strHTML +="</td></tr></table>"; td.className = TAB_STYLE_NOMAL + this.styleSuffix; td.innerHTML = strHTML; tabpage.__titleTD = td; tabpage.setTitleTD(); tabpage.initStatus(); this.__titleTR.insertBefore(td,this._titleTD); tabpage.titleWidth = td.offsetWidth; }
href='javascript:function()'> Dies ist so geschrieben, dass der Link nicht auf eine neue Seite verweist und stattdessen einen Teil des JS-Codes ausführt. Es kann den gleichen Effekt haben wie onclick. Wenn Sie ein Skript aufrufen möchten, sollten Sie den Code trotzdem in das onclick-Ereignis schreiben. Es wird nicht empfohlen, href zu verwenden ='javascript:function()' Diese Schreibweise liegt daran, dass nach dem Festlegen des js-Codes im Attribut href in einigen Browsern möglicherweise andere unnötige Ereignisse ausgelöst werden. unbeabsichtigte Effekte hervorrufen.Und Das Onclick-Ereignis wird vor dem Attribut href ausgeführt, sodass es zuerst ausgelöst wird. onclick löst dann href aus. Wenn Sie also nicht möchten, dass die Seite springt, können Sie dies festlegen Der js-Code in onclick gibt am Ende false zurück, sodass der Inhalt von href nicht ausgeführt wird. Schreiben Sie in der Ajax-Anwendung eher wie folgt , um anzuzeigen, dass dieser Link nicht springt, sondern ein js-Skript ausführt.href="javascript:void(0);" onclick="function()">或者 href="javascript:;" onclick="function()">void(0) 只是用来计算一个空值,其实也是什么事情都不做,而分号“;”则表示是一个空的js语句,这样就不会有任何其他跳转发生了,而且W3C标准不推荐在href里面执行javascript语句,所以还是用 onclick事件触发吧
如果不设置 href属性在IE6下面会不响应hover。双击后会选中标签的父容器而非这个一a标签(IE下都存在这一问题)。
<a href="javascirpt:fn(this)"> <a onclick="fn(this)">
所以,比较推荐的写法是假定我们有个fn方法,需要取到这个元素,第一个方法传入的this是空值。
<a href="javascript:void(0)" onclick="fn(this)">
下面代码则执行了subgo()函数,
<a href="javascript:void(0)" onclick="subgo()">点我</a>
在这里,javascript:void(0),没启实质上的作用,它仅仅是一个死链接,执行的函数是subgo()。
点我与<a href="javascript:void(0)" onclick="subgo()">点我</a>区别。
实际上 #包含了一个位置信息默认的锚是#top 也就是网页的上端 ,而javascript:void(0) 仅仅表示一个死链接,没有任何信息。所以调用脚本的时候最好用void(0)
href一般是指向一个URL地址,也可以调用javascript ,如href="javascript:xxx();",文档中推荐这样写:<
a href="http://www.111cn.net/zhongxing/U880/ javascript:void(0)" onclick="xxx();">xx</a>,
但是这种方法在复杂环境有时会产生奇怪的问题,尽量不要用javascript:协议做为A的href属性,这样不仅会导致不必要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。
我们知道链接的 onclick 事件被先执行,其次是 href 属性下的动作(页面跳转,或 javascript 伪链接),如果不想执行href 属性下的动作执行,onclick 需要要返回 false ,一般是这样写onclick="xxx();return false;".
TabPane的JS源码,由于onclick没有返回FALSE,当IFRMAE中关闭TABPANE时会导致href执行,页面显示有问题。解决办法就是将下面代码复制到使用TAB的JSP中。
Html A标签中 href 和 onclick 同时使用的问题 优先级别
1 顺序
ie 6 : href 先触发 onclick 后触发
其他浏览器 先触发onlick 后触发 href
2 href="javascript: xxx()"
不能传入this作为参数
onclick可以
<a href="javascript:alert('href event');" onclick="clickevent(this);">
3 优先触发的方法如果返回 false 导致后一个事件不被触发
比如
<a href="javascript:alert('href event');" onclick="clickevent(this); return false;">
4