How do I disable a href link in JavaScript?

How do I disable a href link in JavaScript?

I have a tag Previous 1 2 3 4 Next and in some conditions I want this tag to be completely disabled.
Code from comments (this is how the link is generated)
if (n_index != n_pages)
a = a+’

  • >
  • >>
  • ‘;
    else
    a = a+’

  • >
  • >>
  • ‘;
    a = a+’

    ‘;

    Solutions/Answers:

    Solution 1:

    Try this when you dont want user to redirect on click

    <a href="javascript: void(0)">I am a useless link</a>
    

    Solution 2:

    you can deactivate all links in a page with this style class:

    a {
        pointer-events:none;
    }
    

    now of course the trick is deactivate the links only when you need to, this is how to do it:

    use an empty A class, like this:

    a {}
    

    then when you want to deactivate the links, do this:

        GetStyleClass('a').pointerEvents = "none"
    
        function GetStyleClass(className)
        {
           for (var i=0; i< document.styleSheets.length; i++) {
              var styleSheet = document.styleSheets[i]
    
              var rules = styleSheet.cssRules || styleSheet.rules
    
              for (var j=0; j<rules.length; j++) {
                 var rule = rules[j]
    
                 if (rule.selectorText === className) {
                    return(rule.style)
                 }
              }
           }
    
           return 0
        }
    

    NOTE: CSS rule names are transformed to lower case in some browsers, and this code is case sensitive, so better use lower case class names for this

    to reactivate links:

    GetStyleClass('a').pointerEvents = ""
    

    check this page http://caniuse.com/pointer-events for information about browser compatibility

    i think this is the best way to do it, but sadly IE, like always, will not allow it 🙂
    i’m posting this anyway, because i think this contains information that can be useful, and because some projects use a know browser, like when you are using web views on mobile devices.

    if you just want to deactivate ONE link (i only realize THAT was the question), i would use a function that manualy sets the url of the current page, or not, based on that condition.
    (like the solution you accepted)

    this question was a LOT easier than i thought 🙂

    Solution 3:

    You can simply give it an empty hash:

    anchor.href = "#";
    

    or if that’s not good enough of a “disable”, use an event handler:

    anchor.href = "javascript:void(0)";
    

    Solution 4:

    Try this using jQuery:

    $(function () {
        $('a.something').on("click", function (e) {
            e.preventDefault();
        });
    });
    

    Solution 5:

    anchor.href = null;
    

    Solution 6:

    (function ($) {
        $( window ).load(function() {
            $('.navbar a').unbind('click');
            $('.navbar a').click(function () {
                //DO SOMETHING
                return false;
            });
        });
    })(jQuery);
    

    I find this way easier to implement. And it has the advantage that you js. Is not inside your html but in a different file. I think that without the unbind. Both events are still active. Not sure. But in a way you only need this one event