标签onclick的Javascript代码,
我使用下面的代码,但我不能覆盖span标签onclick。
HTML:<div class="primaryNav fl">
<ul id="hd_vertical" class="productNav">
<li id="info" class="validation">
<span class="info">Test</span>
<a class="info" href="http://validator.w3.org/">Test1</a>
</li>
<li id="learn" class="site">
<span class="learn">fi</span>
<a class="learn" href="http://www.w3schools.com/">Buses</a>
</li>
</ul>
</div>
JS:
document.getElementById("hd_vertical").addEventListener("click",function(e) {
if(e.target && e.target.nodeName == "LI") {
var _anchor = e.target.id;
var _url = document.getElementsByClassName(_anchor)[1].getAttribute('href');
location.href = _url;
}
});
jsfiddle:
http://jsfiddle.net/sudheera/NgwS5/我有jquery代码的li标签onclick,我试图在Javascript做同样的事情。
请推荐我!!
由于您的检查仅针对LI
,因此它不会进入其他标记的if语句。你还得处理另一个。对于SPAN
标签你可以输入:
var changeLocation = function(id) {
var _url = document.getElementsByClassName(id)[1].getAttribute('href');
location.href = _url;
}
document.getElementById("hd_vertical").addEventListener("click",function(e) {
var _anchor = "";
if(e.target) {
// checc which tag is clicked.
alert("tag is :" + e.target.nodeName);
if(e.target.nodeName == "LI") {
_anchor = e.target.id;
changeLocation(_anchor);
} else if(e.target.nodeName == "SPAN") {
_anchor = e.target.className;
changeLocation(_anchor);
}
}
});
试试这个
document.getElementById("hd_vertical").addEventListener("click",function(e) {
if(e.target && e.target.className) {
var _anchor = e.target.className;
var _url = document.getElementsByClassName(_anchor)[1].getAttribute('href');
location.href = _url;
}
});
JS小提琴
与其使用class,不如找到parentNode并获得所需的功能
演示小提琴
Javascriptdocument.getElementById("hd_vertical").addEventListener("click",function(e) {
if(e.target.nodeName == "LI") {
var _anchor = e.target.id;
changeLocation(_anchor);
} else if(e.target.nodeName == "SPAN") {
var span = e.target;
var li = span.parentNode;
var _anchor = li.id;
changeLocation(_anchor);
}
});
相同的答案希望对大家有所帮助....