JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#">1</a>
<a href="">2</a>
<a href="http://website.com/#/home/about/">3</a>
<a href="http://website.com/home/about/">4</a>

CSS

a[href="\#"], a[href=""] {
    cursor: default;
    pointer-events: none;
}

JavaScript

$("a").click(function(e){
    if($(this).attr("href") == "#" || $(this).attr("href") == "") {
        alert("this is non-clickable");
        $(this).css({cursor:"default"});
        e.preventDefault();   
    }
    else{
        alert($(this).attr("href"));
        $(this).css({cursor:"pointer"});
        e.preventDefault();   
    }
});