Firefox事件触发问题

时间:2015-05-14 14:03:52

标签: javascript html firefox

我在标记中有一个带有连接事件监听器的列表,每个li包含一个或两个div,并且想法是根据点击的div来做一些事情。 HTML示例:

<ul id="list">
    <li><div class="first a"></div><div class="second b c"></div></li>
    <li><div class="first f"></div></li>
    <li><div class="first e"></div><div class="second d r"></div></li>
…

JS示例:

var currentLang = 'en';
var failCounter = 0;
var currentArg = args[Math.floor(Math.random() * args.length)];
var previousArgs = [];

function keyClicked(event) {
    if (event.target.className.split(' ').indexOf(currentArg) > -1) {
        textBox.style.opacity = 0;
        setTimeout(function () {
            textBox.innerHTML = wonMessages[currentLang];
            textBox.style.opacity = 1;
            wrapper.className = 'alert alert-success wrapper-active';
        }, 250);
        wrapper.onclick = function () { location.href = "…" };
        list.removeEventListener('click', keyClicked);
    }
    else {
        if (failCounter < 1) {
            failCounter++;
            previousArgs.push(currentArg);
            do { currentArg = args[Math.floor(Math.random() * args.length)]; }
            while (previousArgs.indexOf(currentArg) > -1);
            textBox.style.opacity = 0;
            setTimeout(function () {
                textBox.innerHTML = wrongMessages[currentLang];
                textBox.style.opacity = 1;
                wrapper.className = 'alert alert-warning';
            }, 250);
        }
        else {
            textBox.style.opacity = 0;
            setTimeout(function () {
                textBox.innerHTML = lostMessages[currentLang];
                textBox.style.opacity = 1;
                wrapper.className = 'alert alert-danger';
            }, 250);               
            list.removeEventListener('click', keyClicked);
        }
    }
}
list.addEventListener('click', keyClicked);

问题在于,虽然它在IE和Chrome中运行良好,但由于某种原因,Firefox在类firstli中的第一个或唯一的一个div时不会触发事件如果li只包含一个div),则单击。 Firefox只识别类second的div的点击。 有什么想法,为什么?这些浏览器之间的区别是什么?

1 个答案:

答案 0 :(得分:0)

如果它可能对某人有帮助 - 我找到了解决方案。问题在于CSS。应该触发事件的Div具有负z-index设置:active state。事实证明,由于某种原因,firefox拒绝为具有负z-index的元素触发事件。