History.js替换了错误的内容

时间:2012-06-19 22:21:44

标签: javascript jquery ajax browser-history history.js

我在JavaScript中有以下启动;顺便说一句,我总是使用github中显示的代码。完整代码可以是seen here

var
        /* Application Specific Variables */
        contentSelector = '.tab-content,.page-content,article:first,.article:first,.post:first',
        $content = $(contentSelector).filter(':first'),
        contentNode = $content.get(0),
        $menu = $('#menu,#nav-sub,.nav,.nav-sub:first').filter(':first'),
        activeClass = 'active selected current youarehere open',
        activeSelector = '.active,.selected,.current,.youarehere, .open',
        menuChildrenSelector = '> li,> ul > li',
        /* Application Generic Variables */
        $body = $(document.body),
        rootUrl = History.getRootUrl(),
        scrollOptions = {
            duration: 800,
            easing:'swing'
        };

问题在于:

contentSelector = '.tab-content,.page-content,article:first,.article:first,.post:first',

并在:

$menu = $('#menu,#nav-sub,.nav,.nav-sub:first').filter(':first'),

点击.nav菜单时,必须更改.page-content

.nav-sub中点击菜单时,必须在.tab-content

中替换内容

问题是,菜单的更改.page-content,而不是标签内容或网页内容。

知道如何改变这个吗?

2 个答案:

答案 0 :(得分:1)

修复内容选择

改变
contentSelector = '.tab-content,.page-content,article:first,.article:first,.post:first'

contentSelector = '.tab-content, .page-content, .article:first, .post:first'

答案 1 :(得分:0)

History.js不会替换错误的内容; ajaxify-html5.js(您正在使用的脚本)完全按照设计进行:

  • 如果用户单击内部链接(并且链接没有no-ajaxy类),则脚本会拦截单击,停止浏览器加载页面,并启动Ajax请求对于页面。

    请注意,这包括页面上的所有内部链接,而不仅仅是菜单中的链接。

  • 当Ajax请求完成后,脚本会使用响应中的内容替换当前页面上的内容(并执行其他一些聪明的操作,例如在右侧菜单项上设置activeClass,更新页面标题并从响应中运行脚本。)

    该脚本使用contentSelector找到的第一个元素作为“内容”节点。这不取决于用户点击的链接。


如果您只想“ajaxify”菜单链接,可以更改(第95行):

$body.ajaxify();

改为在菜单元素上调用.ajaxify()

如果您想使用新内容更新其他元素,可以更改(第145行):

$content.html(contentHtml).ajaxify().css('opacity',100).show(); /* you could fade in here if you'd like */

更新另一个元素。