实施 History.js HTML4 后备

发布于 2024-12-01 08:08:32 字数 992 浏览 1 评论 0原文

jQuery 插件 HISTORY.js (https://github.com/browserstate/History.js/) 提供 HTML5 历史推送实现功能,并且在浏览器不支持的情况下,应该能够实现 HTML4 主题标签功能。文档/自述文件详细介绍了用法,如下所示:

   var History = window.History; // Note: We are using a capital H instead of a lower h
    if ( !History.enabled ) {
         // History.js is disabled for this browser.
         // This is because we can optionally choose to support HTML4 browsers or not.
        return false;
    }

如您所见,文档解释了 HISTORY.js 插件到 HTML5 的用法,但没有解释 HTML4 支持的用法。

然而,在文档的“下载和安装”部分,它写道:

5. Include History.js 
<script src="http://www.yourwebsite.com/history.js/scripts/compressed/history.js">/script>
<script src="http://www.yourwebsite.com/history.js/scripts/compressed/history.html4.js"></script>

此处的说明可能表明 HTML4 主题标签支持是自动的,但使用页面上的说明表明必须手动实现;我相信事实确实如此。

我找不到任何有关实现 HTML4 主题标签功能的进一步文档。请帮我解决这个问题。

The jQuery plugin HISTORY.js (https://github.com/browserstate/History.js/) provides a HTML5 history push implementation feature and in case of an unsupporting browser, should be able to implement a HTML4 hashtag feature. The documentation/README file details the usage as so:

   var History = window.History; // Note: We are using a capital H instead of a lower h
    if ( !History.enabled ) {
         // History.js is disabled for this browser.
         // This is because we can optionally choose to support HTML4 browsers or not.
        return false;
    }

As you can see, the documentation explains the usage of the HISTORY.js plugin to the point of HTML5 and does not explain the usage of the HTML4 support.

However, under the "Download & Installation" section of the documentation, it reads:

5. Include History.js 
<script src="http://www.yourwebsite.com/history.js/scripts/compressed/history.js">/script>
<script src="http://www.yourwebsite.com/history.js/scripts/compressed/history.html4.js"></script>

The instructions here may convey that the HTML4 hashtag support is automatic but the instructions on the usage page suggest that it must be manually implemented; which I believe is actually the case.

I cannot find any further documentation on implementing the HTML4 hashtag feature. Please help me figure this out.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

柠檬色的秋千 2024-12-08 08:08:32

好吧,也许问题是你没有以正确的方式使用 History.js (这也是我遇到的问题)。基本上,要以正确的方式使用 History.js,您必须执行以下操作:

// Register navigation click handlers where you will load Ajax content
$( window ).on( 'click', 'a.ai1ec-load-view', handle_click_on_link_to_load_view );
// Bind to the statechange event
$( window ).bind( 'statechange', handle_state_change );

// When the state changes, load the corresponding view
var handle_state_change = function( e ) {
    var state = History.getState();
    load_view( state.url, 'json' );
};

// When clicking on a link you want to load, trigger statechange by changing state
var handle_click_on_link_to_load_view = function( e ) {
    e.preventDefault();
    History.pushState( { target :this }, null, $( this ).attr( 'href' ) );
};

在执行此操作之前,我没有监听 statechange 并且我只是在链接点击处理程序中使用了 pushState() 。

如果您这样做,则无需编写后备代码,它也可以在 html4 浏览器中工作(并且来自 html4 浏览器的书签将按预期工作)

Ok maybe the problem was that you weren't using History.js in the right way ( that's the problem i was having too ). Basically to use History.js in the correct way you must do something like:

// Register navigation click handlers where you will load Ajax content
$( window ).on( 'click', 'a.ai1ec-load-view', handle_click_on_link_to_load_view );
// Bind to the statechange event
$( window ).bind( 'statechange', handle_state_change );

// When the state changes, load the corresponding view
var handle_state_change = function( e ) {
    var state = History.getState();
    load_view( state.url, 'json' );
};

// When clicking on a link you want to load, trigger statechange by changing state
var handle_click_on_link_to_load_view = function( e ) {
    e.preventDefault();
    History.pushState( { target :this }, null, $( this ).attr( 'href' ) );
};

Before doing this i wasn't listening to statechange and i was simply using pushState() in the link click handler.

If you do it like this there is no need to code a fallback, it will work also in html4 browsers ( and bookmarks from html4 browsers will work as expected )

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文