.unbind（）不适用于event.preventDefault（）

Question

I have a responsive Javascript file that is working successfully on unbinding basic jQuery functions.

When the browser is set to be in tablet, the navigation becomes toggled based on click, therefore I disable the linking to any li elements that have a ul.

$('.main-navigation .menu > ul > li > a, .main-navigation .menu > ul > li > ul > li:has(ul) > a').on('click', function(event) {
   event.preventDefault();
});

Then when the browser is sized above the tablet constraint, I am attempting to reenable the linking functionality with this (I have tried 3 different ways):

$('.main-navigation .menu > ul > li > a, .main-navigation .menu > ul > li > ul > li:has(ul) > a').unbind('on');

$('.main-navigation .menu > ul > li > a, .main-navigation .menu > ul > li > ul > li:has(ul) > a').unbind('click');

$('.main-navigation .menu > ul > li > a, .main-navigation .menu > ul > li > ul > li:has(ul) > a').on('click', function(event) {
   return true;
});

Please let me know if there is anything else I can provide that might be helpful

Answer 1

I was able to find the solution to my own problem here. Thought I would post just in case someone else has a similar issue.

My responsive JavaScript has 2 functions per screen size. I had something like this:

function tabletInit() {
 // add jQuery that is supposed to fire within these constraints
    function mobileNavInit() {
    var submenus = $('.main-navigation .children');

    submenus.each(function() {
      var parentLink = $(this).prev(),
          parentHref = parentLink.attr('href'),
          overview = '<li class="overview"><a href="'+parentHref+'">Overview</a></li>';

      $(overview).prependTo($(this));
    });

    }

    $('.main-navigation .menu > ul > li > a, .main-navigation .menu > ul > li > ul > li:has(ul) > a').on('click', function(event) {
   event.preventDefault();
});

}

function tabletClear() {
 // undo or 'unbind()' anything that should be cancelled out if tablet is sized above

$(overview)unbind('prependTo');
$('.main-navigation .menu > ul > li > a, .main-navigation .menu > ul > li > ul > li:has(ul) > a').unbind('click');

}

The interference was one the unbinding of the overview function. Though the unbinding was performing as needed, it ended up interfering with some of the other JavaScript. So I simply changed it to:

$('.overview, .overview2').remove();