时间戳

首页 > 解决方案 > 如何重定向页面放大器？

amp-html - 如何重定向页面放大器？

问题描述

我需要将以下 javascript 代码改编为 amp 页面。

<select id="url"> 
   <option value='home'>home</option> 
   <option value='contact'>contact</option> 
</select>

<input type="button" value='ir' onclick='ir()'> 

<script> 
function ir(){ 
   var url=document.getElementById("url").value; 
   location.href=url; 
}
</script>

这是可能的？

在文档中我没有找到答案。

标签： amp-html

解决方案

您正在使用按钮和 onclick 功能，在 AMP 中，您可以使用锚标记<a href="Value">Value</a>并使用“amp-bind”更改网址

你可以amp-bind用来实现你的目标

这是工作网址

在标题中添加 JS

<script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>

在正文中添加代码

<div class="wrapper">

    <select on="change:AMP.setState({ url: event.value })">
      <option value='home'>home</option> 
      <option value='contact'>contact</option> 
    </select>

    <a [href]="url" href="home">ir</a>

</div>

更新- 如果有人想重定向选项更改而不是使用navigateTo操作

例子 ：

<select on="change:AMP.navigateTo(url=event.value)">
    <option value="http://google.com">google.com</option>
    <option value="http://yahoo.com">yahoo.com</option>
    <option value="http://bing.com">bing.com</option>
  </select>

推荐阅读