jQuery 移动 ajax 导航

发布于 2024-10-21 00:22:41 字数 669 浏览 3 评论 0原文

我刚刚开始接触 jQuery mobile(到目前为止它看起来真的很有趣)。

我读了elated.com 上的很棒的教程,其中一部分是关于页面转换/ajax 导航的。这看起来很棒(在我的 iPhone 上),但如果你看一下源代码,它都是在同一页面上的平面 html。

我想要/需要的是指向另一个网址,并在可能的情况下发生相同的效果。

我一直在阅读此处有关 data-url 的信息,但我似乎无法让任何事情发挥作用。

这是一些非常粗略的示例代码,显然不起作用:

<p><a href="#" data-url="test.html" data-transition="flip">My test link</a></p>

什么是正确的代码?有可能吗?

I am just getting my teeth into jQuery mobile (and so far it looks really interesting).

I read a great tutorial on elated.com, one part of which was about page transitions/ajax navigation. This looks great (on my iPhone) but if you look at the source it's all flat html on the same page.

What i want/need is to point to another url and for ther same effect to happen if possible.

I have been reading here info about data-url but I cant seem to get anything to work.

Here is some very rough example code that obviosuly doesnt work:

<p><a href="#" data-url="test.html" data-transition="flip">My test link</a></p>

What is the right code? Is it even possible?

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

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

发布评论

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

评论(3

转身以后 2024-10-28 00:22:41

尝试 link

似乎太明显了? ;)

data-url 是页面 div 在加载时所具有的属性。所有页面都通过 AJAX 加载到当前 DOM,并且可以轻松找到此属性。

try <a href="test.html">link</a>

seems too obvious? ;)

data-url is an attribute that a page div has, when it's been loaded. All pages are AJAX-loaded to the current DOM and they get this attribute to be easy found.

伴我老 2024-10-28 00:22:41

来自http://jquerymobile.com/test/docs/pages/page-links。 html

默认链接行为:Ajax

要启用动画页面转换,所有指向外部页面(例如 products.html)的链接都将通过 Ajax 加载。为了不引人注意地执行此操作,框架会解析链接的 href 以制定 Ajax 请求 (Hijax) 并显示加载微调器。所有这一切都由 jQuery Mobile 自动发生。

如果 Ajax 请求成功,新的页面内容将添加到 DOM,所有移动小部件都会自动初始化,然后新页面会通过页面转换以动画形式呈现在视图中。

From http://jquerymobile.com/test/docs/pages/page-links.html

Default link behavior: Ajax

To enable animated page transitions, all links that point to an external page (ex. products.html) will be loaded via Ajax. To do this unobtrusively, the framework parses the link's href to formulate an Ajax request (Hijax) and displays the loading spinner. All this happens automatically by jQuery Mobile.

If the Ajax request is successful, the new page content is added to the DOM, all mobile widgets are auto-initialized, then the new page is animated into view with a page transition.

迷途知返 2024-10-28 00:22:41

将标签:data-ajax="false" 添加到您想要显式加载新页面的任何内容,例如:

<a href="xyz.html" data-ajax="false">Link</a>

或者您可以使用本机锚点target 标签

add the tag: data-ajax="false" to anything you want to expliticly load a new page for, eg:

<a href="xyz.html" data-ajax="false">Link</a>

Alternatively you can use the native anchor target tag

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