addEventListener在点击li的时候-防止这个如果链接被点击在li里面

addEventListener on clicked li - prevent this if a link is clicked that is inside the li

本文关键字:li 如果 链接 里面 addEventListener      更新时间:2023-09-26

在单击的列表项上有一个addEventListener。我想防止这个addEventListener,如果一个链接被点击,是在列表项。

http://jsfiddle.net/8xea1eku/-在这个例子中。如果this是被单击的链接,我想阻止切换操作。我该怎么做呢?

<div class="faq">
    <ul>
        <li>
            asdasdasdasdaa
            <span class="answerswer">
                <a href="http://google.com">clickme</a> jdiajdoi asjdoiaj sdoiaj odsjaso djaosdj oaisjdo.
            </span>
        </li>
        <li>
            asdasd
            <span class="answerswer">
               sadoia hdoas jdiajdoi asjdoiaj sdoiaj odsjaso djaosdj oaisjdo
            </span>
        </li>

        <li>
            asdasdasdasd
            <span class="answerswer">
               sadoia hdoas jdiajdoi asjdoiaj sdoiaj odsjaso djaosdj oaisjdo
            </span>
        </li>
    </ul>
</div>
if (document.getElementsByClassName('faq').length > 0) {
    var faqItems = document.querySelectorAll('.faq li');
    for (var i = 0; i < faqItems.length; i++) {
        faqItems[i].addEventListener('click', function () {
            this.classList.toggle("active");
        });
    }
}

使用事件对象查看被单击的内容。

    faqItems[i].addEventListener('click', function (e) {
        if (e.target.nodeName==="A") return;
        this.classList.toggle("active");
    });