当 event.target 为 XMLHttpRequest 时，获取活动 DOM 元素

Question

我需要获取单击元素的属性值，但我通过单击有一个ajax请求，在本例中，event.target是XMLHttpRequest而不是单击的DOM元素。在这种情况下如何获取点击的 DOM 元素？

// Parsing and makeup.
function showDescription(XMLObj){
    var parser = new DOMParser(),
    XMLDoc = XMLObj.responseText,
    parsedXMLDoc = parser.parseFromString(XMLDoc, 'text/xml'),

    eventTarget = event.target,
    descContent = document.getElementById('description') ;

    // Conditional actions.
    };
};

// Create request.
function loadAsync(url, callback) {
    var request;
    if(window.XMLHttpRequest) {
        request = new XMLHttpRequest();
        request.open("GET", url, true);
        request.send(null);
        request.onreadystatechange = requestProcess;
    } else if(window.ActiveXObject){
        request = new ActiveXObject('Microsoft.XMLHTTP');
        if (request) {
            request.open("GET", url, true);
            request.send(null);
            request.onreadystatechange = requestProcess;
        }
    }

    function requestProcess() {
        if (request.readyState == 4) {
            if (request.status == 200) {
                if (typeof callback == 'function') {
                    callback(request)
                }
            }
        }
    };
};

// Define event listener for each menu element.
function showDescListener(){
    var descPars = document.getElementById('description-paragraphs'),
    descParLi = descPars.getElementsByTagName('li');

    for (var i = 0; i < descParLi.length; i++){
        descParLi[i].addEventListener('click', function(event) {loadAsync('/description/', showDescription)}, false);
    }
};

Answer 1

更改

function showDescription(XMLObj){

为

function showDescription(XMLObj, target){

然后更改

descParLi[i].addEventListener('click', function(event) {loadAsync('/description/', showDescription)}, false);

为

descParLi[i].addEventListener('click', function(ev) {loadAsync('/description/', function(request) { showDescription(request, ev.target); })}, false);

然后在 showDescription 中使用 target。

---

此更改捕获在闭包中单击按钮时的事件，然后在回调中使用该事件。换句话说，请注意回调函数如何使用 ev 参数 - 调用回调时会保留 ev 的值，及其 target< /code> 属性（您想要的 DOM 元素）然后被传递到 showDescription 中。