为什么这不会阻止默认链接？

Question

我试图阻止默认的链接,因为我动态加载到页面的div使用jQuery,并为每个喜欢href是刚刚页面之前的名称(例如href=home,和固定加载代码下面home.php).

//initialize home page as active on load up and deactivate link
var activePage = $('a[href$="home"]');
var activePageHref = activePage.attr('href');
activePage.attr('href', '#');

$('a').click(function(e) {
    e.preventDefault();
    //set the page clicked on
    var page = $(this).attr('href');
    //check to see if there are any extras to url for php
    var pageCheck = page.split('?');   
    //sort page type
    if (pageType == null) {
        //dynamically load the page in div bodycontent
        $('#bodycontent').load(page + '.php');
    } else {
        $('#bodycontent').load(page + '.php?' + pageCheck[1]);
    }
    //pull up last disabled link for navigation
    var setOld = $('a[href$="' + activePageHref + '"]');
    setOld.attr('href', '' + activePageHref + '');
    //set the new disabled link for navigation
    activePage = page;
    //make link inactive
    $(this).attr('href', '#');
});

最后返回false是好的,直到我在click事件函数中添加了我需要发生的更多事情,但确切地说,这部分:

//pull up last disabled link for navigation
    var setOld = $('a[href$="' + activePageHref + '"]');
    setOld.attr('href', '' + activePageHref + '');
    //set the new disabled link for navigation
    activePage = page;
    //make link inactive
    $(this).attr('href', '#');

现在e.preventDefault();,这是我理解正确的做我需要发生的事情的方法,就是阻止整个事情在任何链接上触发.我被卡住了.我只需要停止默认操作,并使用我在最后添加的附加功能构建的功能,使我的导航非常漂亮.

另外,我确实有一个悬停功能绑定到这个导航的ul,但没有包含它,因为它不应该导致问题,但我可以把它放在这里,如果需要的话.这是本文档就绪功能中唯一的另一件事.

Answer 1

更新:

由于您最初更改了禁用链接的href,因此属性包含选择器以后将无法再次找到它以激活它.我建议这样做有点不同.

您可以使用类捕获整个"禁用链接"功能.如果向应该"禁用"的链接添加类,则可以阻止浏览器仅跟踪具有该指定类的链接.

当您单击"启用的链接"时,请按照它然后将其禁用.然后,启用所有其他链接.

$('a').click(function() {
    $(this).addClass('disabledLink');
    $('a').not(this).removeClass('disabledLink');
}

然后,为整个文档设置一个事件侦听器,以阻止对具有某个类的链接的默认操作.

$(document).on('click', 'a.disabledLink', function(e) {
    e.preventDefault();
}

这应该实现你想要的(即它将取代你上面的整个'click'处理程序).请注意,href永远不会更改为"#".

否则:只是缓存链接本身及其href

//pull up last disabled link for navigation
activePage.attr('href', '' + activePageHref + '');

//set the new disabled link for navigation
activePage = $(this);
activePageHref = $(this).attr('href');

//make link inactive
$(this).attr('href', '#');

您有一个语法错误导致JS引擎停止:

//pull up last disabled link for navigation
$('a[href$="' + activePageHref + '"]').attr('href', '' + activePageHref + '');

//set the new disabled link for navigation
activePage = page.attr('href');
/* THIS HERE RETURNS A STRING SO YOU CHANGE activePage to a string. */

// Should probably be:
activePageHref = page.attr('href');

//make link inactive
activePage.attr('href', '#');

如果您调用此方法,则将activePage设置为字符串,该字符串没有方法,.attr()因此会抛出错误并停止执行该函数.