3

我有一个场景,我试图使用链接在我的 Android 应用程序的页面内导航。我将HTML5Phonegap和 JQuery Mobile 一起使用。

例如,我有:

<h3><a name="try"/> Header2 </h3>

当我给予时,

<a href="#try"> Navigate to Header2 </a>

为了导航到同一页面中的标题部分,我无法这样做。有人可以为这个问题提供一些解决方案吗..?

作为@Adleer 提供的解决方案的一部分,尝试使用同一 HTML 文档的多个部分。下面是一个示例代码供参考:

<body>
<div data-role="page" id="page3">
<div data-role="header">
<h3>Common diphthongs</h3></div></div>

<div data-role="page" id="diphthongs">
<div data-role="content">
<ul>
<li> Test </li>
<li> item2 </li>
</ul>
</div></div>

<div data-role="page" id="vowels">
<div data-role="content">
<ul>
<li><a href="#diphthongs"> Link to Diphthongs </a> </li>
<li><a href="#page3"> Link to page3 </a> </li> </li>
</ul>
</div></div>
</body>

上述代码仅供参考所提供的解决方案之一。

4

3 回答 3

3

你想引用一个id,你可以使用一个段落、一个span或一个div。

<span id="try">Header2</span>

然后,您可以按预期导航到它:

<a href="#try">Navigate to Header2</a>

另外,你做的方式

<a name="try/> Header2 

不正确,您的报价关闭丢失并且您没有正确关闭 a 属性。

于 2013-08-20T15:27:02.040 回答
2

在您添加的最后一个 jsfiddle 中,您在选择器和 HTML 属性中出现了一些错误。您可以使用id带有唯一标识符的属性和选择器$('#Anyname')- 区分大小写(注意大写/小写字母) - 来访问该元素的属性。

或者,使用name带有 unqiue 标识符的属性和选择器$('[name=Somename]')- 区分大小写(注意大写/小写字母) - 来访问该元素的属性。

要向下滚动到任何元素,jQuery Mobile 有它自己的滚动功能.silentScroll()。请注意,$.mobile.silentScroll()它没有动画,不像.animate({ scrollTop: value }, animation-speed).

演示

$('selector').on('click', function () {
  var position = $.mobile.activePage.find('#vowels2').get(0).offsetTop;
  $.mobile.silentScroll(position);
});

其中.get(0).offsetTop是目标元素的y轴位置值,$.mobile.activePage是活动/当前页面/视口。

于 2013-08-21T13:56:41.710 回答
0

你想引用一个id,你可以使用一个段落、一个span或一个div。

<span id="try">Header2</span>

然后,您可以按预期导航到它:

<a href=" #try" data-ajax="false">Navigate to Header2</a>

当您设置为data-ajaxfalse 时,它​​可以工作:) 刚刚尝试过...

于 2014-06-05T13:57:33.207 回答