Issues with event.preventDefault() not working

Question

looking for some advice around the correct usage of preventDefault() - code is below. In short, I don't want the a.dropdownTrigger click event to jump to the anchor. I thought inserting event.preventDefault() as the first line of that function would do the trick, but apparently not.

Thinking it might have something to do with having bound the hashchange event, which I'm using to monitor changes to the url (clicking the a.dropdownTrigger element updates the hash location, which calls the listener on hashchange - doing it this way enables me to catch inbound links to a dropdownTrigger, and maintain url history).

Any ideas where I'm going wrong?

    // check inbound anchor links against dropdown ids
    if (hash != "" && dropdowns.length != 0 && $.inArray(hash, dropdowns)) {
        OpenDropdownForHash(hash);
    }

    // listen for hashchange once page loads (handles on-page links to dropdown content)
    $(window).bind('hashchange', function () {
        hash = window.location.hash;
        if (dropdowns.length != 0 && $.inArray(hash, dropdowns)) {
            OpenDropdownForHash(hash);
        }
    });

    // open the targeted dropdown - var incoming is a bool, differentiate between inbound links and on-page clicks
    function OpenDropdownForHash(x) {

        $(x).next('.dropdown').toggleClass('open').slideToggle(200);

        if ($(x).next('.dropdown').hasClass('open')) { //can this live in the callback above? 
            $(x).parent().css("-webkit-transition", "all 0.8s ease")
                .css("backgroundColor", "white")
                .css("-moz-transition", "all 0.8s ease")
                .css("-o-transition", "all 0.8s ease")
                .css("-ms-transition", "all 0.8s ease")

                .css("backgroundColor", '#eeeeee').delay(600).queue(function () {
                    $(this).css("backgroundColor", "white");
                    $(this).dequeue(); //Prevents holding color with no fadeOut on second click.
                });
        }
    }

    // finally, the basic click handler for dropdowns - update the hash (to allow history), which triggers previously bound hashchange event
    $('a.dropdownTrigger').bind('click',function (e) {
        e.preventDefault();
        if ("#" + $(this).attr('id') == location.hash) { // clicking an open dropdown link doesn't trigger the hashchange event, so we check manually
            OpenDropdownForHash("#" + $(this).attr('id'));
        }
        else { // clicking a closed dropdown does call hashchange, so the OpenDropdownForHash function is called by the listener
            location.hash = $(this).attr('id');
        }
    });

UPDATE: Solved this with a bit more effort, reworked the click handler and simplified the hashchange listener:

    if (dropdowns.length != 0) {
        // the basic click handler for dropdowns - update the hash (to allow history), which triggers previously bound hashchange event
        $('#mainContentContainer a').bind('click', function (e) {
            var target = $(this).attr('href') != null ? $(this).attr('href') : "#" + $(this).attr('id');
            var offset = window.pageYOffset;
            if ($.inArray(target, dropdowns) && location.hash != target) {                    
                location.hash = target;
                window.scrollTo(0, offset);
            }
            else if ($.inArray(target, dropdowns) && location.hash == target) {
                OpenDropdownForHash(location.hash, $(this).hasClass('dropdownTrigger'));
                window.scrollTo(0, offset);
            }
        });
    }

    $(window).bind('hashchange', function(e) {
        OpenDropdownForHash(location.hash, $(this).hasClass('dropdownTrigger'));  
    });

Answer 1

If clicking the link updates the hash, the e.preventDefault(); is not working. Check, that the links really get bound.

Seems like they are not. Try replacing e.preventDefault(); with alert('I am bound!!!'); and see what happens upon clicking the link.

Are you wrapping the code in document ready?

EDIT: If I understand it correctly, your anchor click handler is redundant, as clicking the link updates the hash itself.