通过electron的webView使用按钮控制前进后退

最新推荐文章于 2024-05-14 09:55:39 发布
最新推荐文章于 2024-05-14 09:55:39 发布
阅读量6.3k 收藏 4
点赞数 1
分类专栏： electron
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/chenyidong521/article/details/78833517
版权

HTML页面如下,使用electron中的webView来进行网页的浏览，然后在总体的html文件中添加两个按钮，前进和后退，布局的话看自己喜欢的位置。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="generator" content="GWrite (WYSIWYG editor)">
  <title></title>
  <style>
最低0.47元/天 解锁文章
小土豆子额
关注
  • 1
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
electron webview 点击网页链接，将内容重新显示到webview
帅呆了我的高
05-11 1万+
首先将webview设置可以打开新窗口 allowpopups属性 &lt;webview id="foo" src="https://www.baidu.com" allowpopups&gt;&lt;/webview&gt; 添加新窗口监听事件，解析出url，将webview的src设置位url const webview = document.getElementById('f...
electron-webview-schedule:Webview调度管理，支持Electron的异步队列
05-01
电子网页时间表 Webview调度管理模块，支持Electron的异步队列。分期付款$ npm i electron-webview-schedule --save用法在渲染器过程中导入。 import moment from 'moment' ;import PromiseQueue from 'electron-...
【Electron】webview 实现网页内嵌
m0_64494670的博客
12-30 2237
Electron内通过 webview标签实现网页内嵌动态切换技术
electron增加导航按钮_Electron发布6.0 Released版本
weixin_39914975的博客
11-21 281
简介在第5版发布仅3个月后，流行的基于JavaScript的跨平台桌面应用程序构建平台达到了第6版，并使用了Chromium 76，Node 12.4和V8 7.6。6.0.0发行说明突破性变化升级到Chromium 76.0.3809.88，Node.js 12.4.0和V87.6.303.22修复了net模块头和Node.js http.IncomingMessage头之间的差异。＃17517...
探索未来打印体验：Electron-PDF 开源项目指南
最新发布
gitblog_00098的博客
05-14 386
探索未来打印体验：Electron-PDF 开源项目指南 项目地址:https://gitcode.com/fraserxu/electron-pdf 在数字化时代，从网页和文档中生成高质量的PDF文件变得至关重要。今天，我们向您推荐一个强大的工具——Electron-PDF，这是一个基于Electron框架的命令行工具，能够方便快捷地将URL、HTML或Markdown转换为PDF格式。 项目简...
android中Webview内前进后退页面问题
木子帅的笔记
05-04 2459
WebView webView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_web_view); webV...
1.1.0 Electron 入门 Hello world
mejian1992的博客
02-03 207
VSCode Atom slack wordpress 项目安装 npm install electron --save-dev 全局安装 npm install -g electron 1.0 Hello World 项目目录 main.js var electron =require('electron') var app=electron.app var BrowserWindow=electron.BrowserWindow// 控制窗口的引用 ...
有了这个网络安全面试题，面试就像开了挂！（附PDF）
lvaolan的博客
02-26 550
还有兄弟不知道网络安全面试可以提前刷题吗？费时一周整理的160+网络安全面试题，金九银十，做网络安全面试里的显眼包！王岚嵚工程师面试题（附答案），只能帮兄弟们到这儿了！如果你能答对70%，找一个安全工作，问题不大。对于有1-3年工作经验，想要跳槽的朋友来说，也是很好的温习资料！【完整版领取方式在文末！！​​​​内容实在太多，不一一截图了。
electron 页面Menu、鼠标右键Menu和自定义快捷键globalShortcut（五）
黄彪博客
09-21 2536
文章目录案例知识点说明：全局快捷键 和 菜单快捷键的区别？ 案例 const { app, BrowserWindow, globalShortcut } = require('electron') const path = require('path') var mainWindow = null // 声明要打开的主窗口 const { Menu } = require('electron') app.on('ready', () => { // 设置窗口的高度和宽度 mainWindo
electron-webview-ipc-test:通过Webview演示Electron中的IPC的测试
05-21
电子webview-ipc测试一种通过webview演示Electron中IPC问题的测试。 最初创建该文件是为了演示一个问题，即当更改Webview源时，IPC将在Webview和主流程之间消失。 在0.27.3及更高版本中应该可以正常工作。
使用Electron构建桌面应用
02-24
还可以通过alt-tab或者cmd-tab切换应用；和操作系统之间的交互更良好（快捷键，通知栏等）。使用JavaScript开发桌面应用意味着在打包（packageapplication）的时候你会需要根据操作系统的不同发出不同的命令。这一...
electron中使用bootstrap的示例代码
10-17
主要介绍了electron中使用bootstrap的示例代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Electron vue的使用教程图文详解
10-16
Electron相当于一个浏览器的外壳，可以把网页程序嵌入到壳里面，可以运行在桌面上的一个程序，可以把网页打包成一个在桌面运行的程序。这篇文章主要介绍了electron-vue多显示屏下将新窗口投放是其他屏幕 ,需要的朋友...
如何利用 Electron 把网页变成桌面程序
热门推荐
前端开发博客
06-15 1万+
正如 Electron 官方所说“如果你可以建一个网站，你就可以建一个桌面应用程序”。作为一个跨平台的桌面应用开发框架，Electron 的迷人之处在于，它是建立在 Chromium 和...
初探Electron，从入门到实践
binmuoc89733的博客
08-29 180
本文由葡萄城技术团队于博客园原创并首发转载请注明出处：葡萄城官网，葡萄城为开发者提供专业的开发工具、解决方案和服务，赋能开发者。在开始之前，我想您一定会有这样的困惑：标题里的Electron 是什么？Electron能做什么？许多伟大的公司使用Electron框架的原因又是什么？带着这些问题和疑惑，通过本文的介绍，可助您全面地认识Electron这门新兴的技术，迅速找到其入...
1.1.4 Electron的菜单快捷键
mejian1992的博客
02-03 598
1 添加快捷键 修改menu.js 添加一句 accelerator:'ctrl+n', 2 运行程序，使用快捷键ctrl
electron增加页面返回_Electron 文档风格指南
weixin_39604557的博客
11-30 813
标题每个页面顶部必须有一个单独的＃级标题。同一页面中的章节必须有##级标题。子章节需要根据它们的嵌套深度增加标题中的＃数量。页面标题中的所有单词首字母都必须大写，除了 “of” 和 “and” 之类的连接词。只有章节标题的第一个单词首字母必须大写.举一个Quick Start的例子:# Quick Start...## Main process...## Renderer...
electron增加页面返回_手把手教你Electron + Vue实战教程（六）
weixin_39759441的博客
11-25 631
作者： Sufen转发链接：https://mp.weixin.qq.com/s/nyIltq4WB7qtqqO_8LhzVw前言系列文章：手把手教你Electron + Vue实战教程(一)手把手教你Electron + Vue实战教程(二)手把手教你Electron + Vue实战教程(三)手把手教你Electron + Vue实战教程(四)手把手教你Electron + Vue实战教程(五)...
【Electron】-BrowserView模块的有趣玩法
qq_43326668的博客
05-22 1220
除了在Electron应用程序中显示Web内容外，BrowserView模块还可以用于实现一些有趣的玩法和应用场景。在本篇文章中，我们将介绍一些有趣的玩法和不同的用途，以展示BrowserView模块的灵活性和强大性。
electron如何使用webView
03-24
Electron使用WebView可以通过以下步骤进行： 1. 在Electron的主进程中创建一个新的BrowserWindow。 2. 指定BrowserWindow的webPreferences.preload选项，将一个预装载的脚本文件的路径设置为它的值。 3. 在预装载的JavaScript文件中，通过require('electron')来获取Electron模块，并使用它的webContents属性操作渲染进程。 4. 在渲染进程的页面上，使用Webview标签创建一个WebView元素，并将其中一个属性的值设置为BrowserWindow.webContents.id，这个属性是为了将WebView与主进程中的BrowserWindow关联起来。设置WebView载入的HTML文档地址。 5. 通过在主进程中执行webContents.executeJavaScript()方法，将预装载的JavaScript文件中定义的函数注入到WebView中。 当所有这些步骤都完成之后，WebView就可以在Electron中使用了。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值