uniapp应用中使web-view页面(webview)返回上一页+注入js操作页面元素

发布时间：2020-07-11 21:42:52 作者：Mos 阅读量：10840

1、体验应用页面代码：

<template>
  <view>
    <web-view :webview-styles="webviewStyles" src="https://movie.i847.cn"></web-view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      webviewStyles: {
        progress: {
          color: "#0bbe06"
        }
      }
    };
  },
  onReady() {
    var currentWebview = this.$scope.$getAppWebview().children()[0];
    currentWebview.addEventListener("loaded", function() {
      currentWebview.evalJS(
        "$(\"ul.fed-part-rows a[href*='resource.i847.cn']\").parent().hide();"
      );
    });
  },
  onBackPress(e) {
    this.$scope
      .$getAppWebview()
      .children()[0]
      .back();
    return true;
  }
};
</script>

2、代码解析：

var currentWebview = this.$scope.$getAppWebview().children()[0];

获取页面webview对象。

onReady() {
    var currentWebview = this.$scope.$getAppWebview().children()[0];
    currentWebview.addEventListener("loaded", function() {
      currentWebview.evalJS(
        "$(\"ul.fed-part-rows a[href*='resource.i847.cn']\").parent().hide();"
      );
    });
  },

监听webview页面加载完成事件，每次加载或跳转页面后都会执行，这里监听完成后给页面注入了一段js代码来隐藏元素。

  onBackPress(e) {
    this.$scope
      .$getAppWebview()
      .children()[0]
      .back();
    return true;
  }

重写app返回事件，让app返回时触发webview页面返回到上一页。

转载请注明出处：文思齐远博客，如果对您有帮助，请喝杯咖啡，谢谢您了！

赏

支付宝打赏

微信打赏

上一篇：重置联通光猫KD-YUN-811G管理员密码桥接到路由器拨号上网

下一篇：下列选项中，谁写作了《江州司马青衫泪》？（）

我要评论

网友评论

评论时间：2021-05-06 11:58:12

大佬，怎么获取web-view history的长度

Mos

评论时间：2020-09-27 13:06:59

关于返回不到原来的uni页面，提供一种思路：可以试一试在onBackPress里面判断webview页面的history的长度，如果存在hostory再back，不存在就作不处理。

欢迎解决的了来评论一下。

linke

评论时间：2020-09-18 15:43:46

内部确实可以跳转，不过返回不到原来的uni页面

评论时间：2020-09-18 15:37:00

返回不了最初的uni页面

评论时间：2020-09-18 15:36:20

webview内部可以跳转，但是返回不到最初的uni的页面，是哪里出了毛病呢

运营者工具

随机文章

在“金兰契互剖金兰语”一回中，薛宝钗劝黛玉吃了些什么？（）

社会主义民主政治的本质是( )。

以下关于改革开放以来中国共产党“不忘初心、牢记使命”的作为的表述有误的是:()。

完善和发展中国特色社会主义制度,推进国家治理体系和治理能力现代化是全面深化改革的()。

（）是保证各部分之间在生产条件的均衡分配的条件。

下面4句话中，最准确的表述是

热评文章

禁止系统自动更新Windows Update Blocker v1.5 汉化版

uniapp应用中使web-view页面(webview)返回上一页+注入js操作页面元素

重置联通光猫KD-YUN-811G管理员密码桥接到路由器拨号上网

“鹰有时飞的比鸡还低，但鸡却没有飞到鹰那么高”是谁的名言？（）

kindeditor-plus

( )是古今中外最伟大的兵家泰斗。