用于li标签onclick位置的Javascript

Javascript for li tag onclick location

本文关键字：Javascript 位置 onclick li 标签 用于      更新时间：2023-09-26

标签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并获得所需的功能

演示小提琴

Javascript 

document.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);
    }
});


相同的答案希望对大家有所帮助....

相关文章：