.

7.跳转页面:页面切换/跳转随机页面/自动翻页/定时翻页

老赵发表于:2021年07月22日 10:33:53更新于:2022年05月13日 14:07:27

一、应用场景

【跳转页面】意为在当前页的H5中,通过不同的触发去跳转到不同的页面。【跳转页面】是H5制作中最常用的触发行为。根据不同的使用场景,大致可以分为【触发器跳转页面】和【手势滑动翻页】两种。

我们将在下文中为您介绍【触发器跳转页面】,【手势滑动翻页】教程请点此处链接。

 

二、通过触发器跳转页面

【跳转页面】触发行为可以在触发器中设置,通常在H5测试题、游戏、生成海报等应用场景中,通过手动点击按钮去设置。

也可以通过计时器结束后去触发定时跳转页面。同理包括动画结束后、数据库操作成功后、条件判断后等行为。

1. 在页面中添加一个文字按钮组件,给其添加触发器【点击时】执行触发行为【跳转页面】。

image.png

 

2. 我们可以选择跳转的是哪一个页面。

  • 首页:整个H5的第0页;

  • 最后页:整个H5的最后一页;

  • 上一页:处于当前页面的前一个页面;

  • 下一页:处于当前页面的后一个页面;

  • 指定页:跳转到从页面0到最后一页中的指定一页(当设置为跳转到指定页时,无论后续再如何从左侧页面面板调整页面顺序,都会保证跳转到指定的那一页);

  • 参数:根据参数变量的值,跳转到参数变量的值所在的页面。需注意参数变量需是数值类型,且数值不能超过页面总数。

 

3. 更改跳转页面时的页面切换方式。

 

4. 跳转方式,我们选择默认的直接跳转即可。

 

注意:如果在同一个按钮上设置了包括【跳转页面】在内的多个触发,请将【跳转页面】触发行为的顺序放在所有触发行为最下方/逻辑最后方,以求其他所有的触发行为都结束后再去执行【跳转页面】的触发器。

 

 

三、FAQ

1. 如何设置跳转到随机页面(随机帧)?

结合触发器行为【跳转页面】和参数变量随机数去跳转页面,跳转到参数所在的页面。

 

2. 如何让H5可以定时翻页呢?

结合触发器行为【跳转页面】和倒计时器去跳转页面,在倒计时结束后跳转到指定页面。

 

3. 如何在点击页面的任意处的时候跳转页面?

可以在当前页的页面触发器上设置点击时-跳转页面。

 

--------- 不了解设计的程序员不是好客服 ---------------