如何为ajax定义变量，以及addeventlistener/pushstate函数?Javascript，而不是jQu

How to define a variable for ajax, and addeventlistener/pushstate function? Javascript, not jQuery

本文关键字：函数 Javascript jQu pushstate addeventlistener ajax 定义 变量 以及      更新时间：2024-01-10

我正在尝试整理控制台消息："Var-foo未定义"。定义变量foo，给我控制台消息：Anonomyus函数。这两者在foo.addeventlistener行上都是冲突的。对此的任何帮助都将不胜感激，我已经看了javascript教程，很多次了，搜索了很长时间，但找不到该做什么。

我知道我可以将foo定义为任何我想要的东西，但它应该是什么，这样我的addevent函数就不是匿名的了？或者我需要在这个代码中进行其他类型的调整吗？

var foo = document.getElementsByTagName("li");
function Food(url) {
    var xmlhttp;
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else { // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById('text').innerHTML = xmlhttp.responseText;
            history.pushState({}, 'foo', url);
        }
    }
    xmlhttp.open("GET", url, true);
    xmlhttp.send();
}
foo.addEventListener('click', function (e) {
    e.preventDefault();
    Food(this.href);
    return false;
}, true);

我不知道该怎么办，如有帮助，不胜感激。

给定的fiddle根本没有函数foo

var foo = document.getElementsByTagName("li");

foo是一个HTMLCollection object，它没有名为addEventListener的方法，因此它抛出错误。

您可能应该做的是遍历集合并绑定事件侦听器。

例如

[].slice.call(foo, 0).forEach(function (el) {
    el.addEventListener('click', function (e) {
        e.preventDefault();
        Mat(this.href); // note:: el is li element, not <a> tag
        return false;
    }, false);
});

或者最优雅的方法是将事件委托给静态的公共父元素

var nav = document.getElementById('cssmenu'); // ensures only one element
nav.addEventListener('click', function (e) {
    var target = e.target;
    // simulate bubbling until captures the required tag
    while (target && target !== this && target.nodeName !== 'A') {
        target = target.parentElement;
    }
    e.preventDefault();
    Mat(target.href);
});

希望这能帮助

相关文章：