使用javascript自定义href

Custom href with javascript

本文关键字:href 自定义 javascript 使用      更新时间:2023-09-26

我想使用javascript模型中的自定义href,这样每个页脚的后退按钮都知道该去哪里。我该如何做到这一点?非常感谢。

 window.APP= {
   models: {
     home: {
       title: 'Home'
     }
     ,
     menu: {
       title: 'Main Menu',
       url: 'views/home.html'
     }
     ,
     cards: {
       title: 'Cards',
       url: 'views/home.html'
     }
     ,
   }
 }
 ;
<body>
  <div data-role="layout" data-id="main">
    <div data-role="header">
      <div data-role="navbar">
        <span data-role="view-title"></span>
      </div>
    </div>
    <div data-role="footer">
      <div data-role="tabstrip">
        <a href="views/home.html" data-icon="home">Home</a> 
        <a href="#" data-icon="reply">Back</a>
      </div>
    </div>
  </div>
</body>

由于后退按钮用于返回上一页,因此可以使用Javascript来完成此操作。(history.go(-1))

<a href="#" data-icon="reply" onclick="history.go(-1);return false;">Back</a>

您无法获取浏览器历史记录的内容。想想看…任何网站都可以在你去过的任何地方看到。。。那太令人毛骨悚然了!

相反,只需调用此:window.history.back()

要返回,只需调用

window.history.back()

要转到主页面,您可以调用根目录。

<a href="/"></a>

function goBack() {
  window.history.back()
}
 window.APP= {
   models: {
     home: {
       title: 'Home' URL: ???
     }
     ,
     menu: {
       title: 'Main Menu'
     }
     ,
     cards: {
       title: 'Cards'
     }
     ,
   }
 }
 ;
<body>
  <div data-role="layout" data-id="main">
    <div data-role="header">
      <div data-role="navbar">
        <span data-role="view-title"></span>
      </div>
    </div>
    <div data-role="footer">
      <div data-role="tabstrip">
        <a href="/" data-icon="home">Home</a> 
        <a href="#" onclick="goBack()" data-icon="reply">Back</a>
      </div>
    </div>
  </div>
</body>