Question

我使用js开发了一个小型Web应用程序。该应用程序正在mozilla ff浏览器中按预期工作。在窗口加载时触发ajax请求，成功改变dom - 包括一个小的select元素并向其添加选项，每个元素都获得一个eventListener。以下是一些相关的摘录：

var lst = null;
window.onload=init;
function init() {
$.ajax({
    data : {
        type : 'someType',
        sender : 'someSender'
    },
    beforeSend : function () {
    },
    success : function (response) {
        response = JSON.parse(response);
        if (response.links.constructor === Array) {
            dispNavList(document.getElementById("navProxy"), response.links);
            atch();
        }
        if (response.data.constructor === Array) {
            dispTable(document.getElementById("dataProxy"), response.data);
            if (response.data.length > 0) {
                setTimeout("refresh()", 1000);
            }
        }
    },
    complete : function () {
    }
});}
function dispNavList(proxy, v) {
if (lst != null) {
    dtch();
    lst = null;
}
proxy.innerHTML = null;
if (v.length > 0) {
    lst = document.createElement('select');
    var i = 0;
    while (i < v.length) {
        var opt = document.createElement('option');
        opt.setAttribute('value', v[i].ename);
        opt.appendChild(document.createTextNode(v[i].dscr));
        lst.appendChild(opt);
        i = i + 1;
    }
    proxy.appendChild(document.createElement("p").appendChild(document.createTextNode('Data fetched @:' + timenow())));
    proxy.appendChild(lst);
} else {
    proxy.appendChild(document.createElement("p").appendChild(document.createTextNode('Data fetch failed @:' + timenow())))
}}
function atch() {
if (lst != null) {
    var options = lst.querySelectorAll("option");
    if (options.length != "undefined") {
        [].forEach.call(options,
            function (e) {
                                console.log('inside');
            e.addEventListener('click', caller,false);//.bind(e), false);
        })
    }
}}
function caller(event) {
    console.log(event.target.nodeType);
    return;
/*var arr = {
    type : 'd',
    sender : this.getAttribute('value')
};
$.ajax({
    data : arr,
    beforeSend : function () {
        clearTimeout(aTout);
        aTout = null;
    },
    success : function (response) {
        clearTimeout(aTout);
        aTout = null;
        response = JSON.parse(response);
        if (response.links.constructor === Array) {
            dispNavList(document.getElementById("navProxy"), response.links);
            atch();
        }
        if (response.data.constructor === Array) {
            dispTable(document.getElementById("dataProxy"), response.data);
            //alert(response.data.length);
            if (response.data.length > 0) {
                setTimeout("refresh()", 1000);
            }
        }
    },
    complete : function () {
        }
    }
});*/}

dtch（）函数与atch（）相反，删除了eventlisteners。那里有一些评论，因为我首先尝试将这个对象绑定到选项（在函数atch（）中）并且它成功地这样做，而调用函数最初没有参数（事件 - 我试过这个来自在线书籍的例子），它恰当地识别了这个对象（在ffox中）。问题是尽管eventListener已正确附加（在开发人员工具中检查过），但未在click上调用caller（）。如果缺少某些东西（代码，其他信息等），请询问，我会提供给他们。另外请忽略其他评论代码，该应用程序正在建设中，我正在尝试各种各样的事情。即使有小的语法错误，我也保证我有一个ffox的工作代码。

Answer 1

很抱歉发布重复的问题。你可以得到@ addEventListener working in firefox but not in chrome的答案。所以改变事件类型以改变＆＃39;选择元素并通过

选择获取选项

selectElement.options[selectElement.selectedIndex].value

使用addEventListener注册的Chrome事件未在“点击”中触发

1 个答案: