Search code examples
javascripthtmlcsspointer-eventsatag

How do you make an anchor link inside tag non-clickable or disabled?

I have an anchor link that was inbuilt with a <i> tag, as I know we can disable/prevent click with different methods on the anchor tag. But my question arises can we prevent the click only for <i> which is present inside the anchor tag.

<a href='#' id='someLink'>some text <i class="disable-pointer-event">External</i></a>

Any clue? Any help will be appreciated !!

Solution 
  • document.getElementById('someLink').onclick = e => {
    if(e.path.map(p => p.tagName).includes('I'))
       e.preventDefault();

 /*  OR

if(e.target.tagName ===  'I')
    e.preventDefault();
*/
}