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

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

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管理员密码桥接到路由器拨号上网

下一篇：全国卫视高清直播软件Android版APP

我要评论

网友评论

评论时间：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的页面，是哪里出了毛病呢

随机文章

以下哪种行为不属于“不当利用”评审材料的行为：

Some people argue that the death ________ does not necessarily reduce the number of murders.

Questions 2

美国联邦宪法的第1条第（）款属于弹性条款。

阿尔拉兹“三组份理论”中，金属的组分包括（）

下列哪些违法行为不可以采取扣留机动车驾驶证的行政强制措施?( )

热评文章

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

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

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

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

kindeditor-plus

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