锚标记在 Tizen Web App 中不起作用答案

【问题标题】：Anchor tags are not working in Tizen Web App锚标记在 Tizen Web App 中不起作用
【发布时间】：2019-12-07 14:32:41
【问题描述】：

我正在为可穿戴设备创建 Tizen Web 应用程序，我想路由到单独页面上的某个点，但锚标记似乎不起作用。他们将我引导到页面，但只是到页面顶部。

我已经尝试了这 3 个选项，第一个选项将我引导到页面顶部，无论标签有多远，其他两个根本不起作用。

我也尝试过使用 href="flags.html#A" 在单独的 HTML 中处理第二页，这也被路由到页面顶部。

我也尝试使用 'name' 代替 'id' 和 'div' 标记代替 'a' 标记，结果相同。

<div class="ui-page ui-page-active" id="main">
    <div class="ui-content">
      <ul class="ui-listview">
          <li><a href="#flags">A
              <i>Alfa</i></a></li>
          <li><a href="#flags#B">B
              <i>Bravo</i></a></li>
          <li><a href="#flagsC">C
              <i>Charlie</i></a></li>
      </ul>
    </div>
</div>
<div class="ui-page" id="flags">
    <header class="ui-header">
        <h2 class="ui-title">Select Flag</h2>
    </header>
    <div class="ui-content">
        <a id="A">A-Alfa</a><br>
            <a><b>International Call Signals</b><br>I have a diver down; keep well clear at slow speed</a><br>
        <a id="B">B-Bravo</a><br>
            <a><b>International Call Signals</b><br></a><br>
        <a id="flagsC">C-Charlie</a><br>
            <a><b>International Call Signals</b><br>Affirmative</a><br>
    </div>
</div>

任何帮助将不胜感激

【问题讨论】：

从锚标签中删除 #。只需编写 YourFileName.html，其中 YourFileName 是您的登录页面。
不知道为什么第一个和第三个不适合你，但是将第二个锚标签从 <a href="#flags#B"> 更改为 <a href="#B">
@RohanRao，我可以让它转到着陆页，但它只是转到顶部，而不是锚标记所在的页面位置。
@ShivamPuri，谢谢，但该按钮此时没有任何作用。我在同一个文件以及另一个文件的第二页中尝试了它，但都不起作用。

标签： html tizen tizen-web-app tizen-wearable-sdk

【解决方案1】：

不是最干净的解决方案，但我最终使用了一个 javascript 函数来实现我的目标。

function loadPage2(flagSelection) {
    window.localStorage.setItem("flagSelected", flagSelection);
    location.href="flagsPage.html";
}

触发;

<li><a onclick=loadPage2("#A");>A
    <i>Alfa</i></a></li>
<li><a onclick=loadPage2("#B");>B
    <i>Bravo</i></a></li>
<li><a onclick=loadPage2("#C");>C
    <i>Charlie</i></a></li>

在第二页上；

var flagSelection = window.localStorage.getItem("flagSelected");

function jumpToFlag() {
    location.href="#";
    location.href=flagSelection;
}

const load = () => {
    console.log("load event detected!");
}   
window.onload = jumpToFlag();

【讨论】：