当href处于另一个单击时会触发事件的类中时，如何使href发挥作用

Question

The question above might not be clear enough, so I will give an example as well:

For example, I have the following html code:

<ul class="do-sth">
    <li>Line 1</li>
    <li>Some text. <a href="http://www.google.com">Line 2.</a> Other text</li>
</ul>

The do-sth class triggers some even whenver it got clicked. So when I click Line 2 , it will trigger that do-sth event and at the same time transferring to the href link. This is NOT what I want. What I would like to have is that whenever I click Line 2 , the do-sth is not triggered. How to do that?

Answer 1

<ul class="do-sth">
    <li>Line 1</li>
    <li>Some text. <a href="somewhere">Line2</a>. Other text</li>
</ul>

<script>
    // try using event.stopPropagation or event.cancelBubble = true for IE
    document.querySelector('a').addEventListener('click', function(e)
    {
        e.stopPropagation();
        // do-sth won't be triggered
    }, false);
</script>

Answer 2

If what you're asking is to remove the onclick event from the anchor tag, the below code will work:

    <ul class="do-sth">
        <li>Line 1</li>
        <li>Some text. <a href="http://www.google.com" onclick="return false">Line 2.</a> Other text</li>
    </ul>