如何在带有外部内容的电子BrowserWindow中注入jQuery
在带有外部内容的电子BrowserWindow中注入jQuery，可以通过以下步骤实现：
- 首先，确保已经安装了jQuery。可以通过在终端或命令提示符中运行以下命令来安装jQuery：
- 首先，确保已经安装了jQuery。可以通过在终端或命令提示符中运行以下命令来安装jQuery：
- 在Electron应用程序的主进程中，使用
webContents.on('dom-ready')事件来监听BrowserWindow的DOM内容加载完成事件。 - 在Electron应用程序的主进程中，使用
webContents.on('dom-ready')事件来监听BrowserWindow的DOM内容加载完成事件。 - 在上述代码中，我们使用了
webContents.executeJavaScript()方法来执行注入jQuery的操作。这将在BrowserWindow的渲染进程中执行JavaScript代码。 - 注意：上述代码中的
index.html是你的Electron应用程序的HTML文件，你可以根据自己的实际情况进行修改。
这样，当BrowserWindow加载完外部内容后，jQuery将被成功注入，你就可以在渲染进程中使用jQuery来操作DOM了。
推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云云函数（SCF）。
相关·内容
2回答
我试着使用window.loadurl在电子中加载web应用程序，并在html中将其作为webview。应用程序正在显示，但有不同的错误，如： $ jquery not defined
Uncaught TypeError: $(...).daterangepicker is not a function
Uncaught TypeError: Cannot read property 'getContext' of undefined 我尝试了不同的方法，最终摆脱了“$ jquery未定义”的错误。为什么电子不能充当浏览器。这个应用程序在所有浏览器上都工作得很好。如何将此w
浏览 67提问于2017-11-10得票数 1
3回答
我正在尝试使用电子快速启动存储库将jquery功能添加到一个用电子方式编写的桌面应用程序中。我将下载的jquery文件添加到main.html文件中，如下所示：
<script> require("./jquery.min.js"); </script>
大概是这样的：
<script>window.$ = window.jQuery = require('./jquery.min.js');</script>
然后在index.js文件中，我在createWindow函数中添加代码，因为这似乎是正确的位置，但老实
浏览 0提问于2016-06-10得票数 7
2回答
我用Electron构建了一个应用程序，我尝试使用webview来显示从我的磁盘加载的文件，我需要在webview中集成节点。尽管它在电子文档here中有记录，但我不能让它工作。我使用main.js文件创建了一个测试项目，该文件创建了一个BrowserWindow，我将在其中加载我的index.html和index.js文件。index.js文件创建了一个webview，其中加载了我的文件，该文件是带有webview.js的webview.html。我在webview.js中调用了require，我可以在DevTools中看到它给出了错误 Uncaught ReferenceError: r
浏览 37提问于2021-03-25得票数 1
回答已采纳
2回答
JQuery不使用电子框架
、、、、
我正在尝试使用jquery和电子框架，使用电子小提琴。然而，jquery似乎不能正常工作，动画也没有执行。示例如下：
main.js
// Modules to control application life and create native browser window
const {app, BrowserWindow} = require('electron')
function createWindow () {
// Create the browser window.
const mainWindow = new BrowserWindow({
浏览 11提问于2020-08-20得票数 1
回答已采纳
我在电子和BrowserWindow.isMaximized中使用BrowserWindow.unmaximize有一个问题，因为我正在制作一个带有自定义窗口框架的应用程序，这是一个很大的问题，因为它不能工作
以下是我的代码：：
const $ = require('jquery');
var remote = require('electron').remote;
var win = remote.getCurrentWindow();
$('#actionBarWindowMin').click(function(e){
win.
浏览 11提问于2017-01-29得票数 0
回答已采纳
我对电子很陌生，只是试着去看文档。
我能够运行一个html的电子，它工作得很好。
然后，我尝试用BrowserWindow loadUrl加载一个Rails应用程序，但是该应用程序的javascripts在电子内部不起作用。
我的主要内容是这里的index.js：
var app = require ('app')
var BrowserWindow = require ('browser-window')
app.on('ready', function(){
var mainWindow = new BrowserWindow({
浏览 4提问于2015-08-12得票数 2
回答已采纳
2回答
我有一个电子应用程序的网页加载在我的BrowserWindow网页上的网页。本网站在某些场合发出确认或警告，但电子正在向他们展示。是否有任何方法来修改这种行为，例如，我在网站页面中注入的代码？
浏览 1提问于2017-11-26得票数 2
回答已采纳
在电子vuejs应用程序的上下文中，我需要在我的应用程序中使用许多窗口，就像网站中的modals。
为此，我在应用程序中创建了一个用于管理窗口/模式的服务。
在开始构建我的电子应用程序时，我使用了一个带有历史模式的vue路由器。
在这种模式下路由器，我所有的窗口运行起来就像一个符咒。
，但我的电子生产环境不能工作，因为我使用历史路由器模式。
现在我使用哈希模式路由器()。
我的生产环境就像一种魅力
，但现在是(这是本文的主要内容！)创建的所有新内容窗口都是相同的。
它是挂载的第一个组件url，因为关联url是"/“。路由器不关心像这样的整个URL路径： --那就是：
这是我启动窗口的代
浏览 2提问于2021-03-26得票数 1
当我尝试在Electron中启用Node的集成时，我得到了这个错误：
如果我删除Node集成，它将再次工作。
function createWindow () {
// Create the browser window.
const mainWindow = new BrowserWindow({
width: 1500,
height: 800,
autoHideMenuBar: true,
webPreferences: {
nodeIntegration: true,
preload: path.join(__d
浏览 0提问于2020-02-12得票数 0
我正试图在windows 10上安装电子设备，但没有工作。我的环境是Windows 10，x64，16 10内存。我已经安装了nodeJS和npm的更新版本。
我的应用程序根目录是c:\nodeP\app1，我尝试在cmd上执行以下命令
cd\
cd nodeP
cd app1
npm init
npm安装电子预建节省开发
npm启动
main.js文件
var app = require('app');
var BrowserWindow = require('browser-window');
app.on('rea
浏览 3提问于2016-07-17得票数 3
我正在尝试使用Angular 2(配置了最新的基于webpack的angular cli)为gui构建一个电子应用程序的原型，但由于我不知道如何在angular2组件中导入电子应用程序接口，我被卡住了。具体地说，我希望能够在点击ui中的按钮时打开一个新的BrowserWindow…所以：
<button type="button" (click)="openNewWindow()">
open
</button>
在我的组件中：
openNewWindow() {
let appWindow = new Browser
浏览 6提问于2016-10-25得票数 3
我目前正在使用javascript开发一个电子应用程序，我想在我的电子应用程序中使用JQuery，我已经添加了教程中所示的代码。我还安装了执行以下JQuery操作的NPM I Jquery --save --我也在代码中添加了win.$ = win.jQuery = require('jquery'); --但是，我得到了一个can not set property 'Jquery' of undefined错误。我该如何处理这个错误呢？
const electron = require('electron')
// Module to co
浏览 2提问于2017-10-17得票数 2
回答已采纳
我正在尝试用Bootstrap做一个电子应用程序。我收到以下错误消息：
Uncaught TypeError: Cannot read property 'fn' of undefined
at setTransitionEndSupport (bootstrap.js:122)
at bootstrap.js:199
at bootstrap.js:201
at bootstrap.js:9
at bootstrap.js:10
我在package.json中的依赖项是：
"dependencies": {
"bootstrap":
浏览 2提问于2018-07-16得票数 12
回答已采纳
我需要从SharedWorkers访问调试信息。在一个普通的铬窗口中，我会通过打开chrome :// BrowserWindow来做到这一点，但我无法在电子的BrowserWindow中做到这一点。
我试着发出
window.open("chrome://inspect")
，但我得到一个空白窗口，打开新窗口中的dev-tools将显示
Not allowed to load local resource: chrome://inspect/
有什么线索吗？
浏览 1提问于2020-07-15得票数 0
回答已采纳
1回答
我使用以下命令安装了电子上下文菜单
npm i electron-context-menu
然后我使用了这个上的代码
const {app, BrowserWindow} = require('electron');
const contextMenu = require('electron-context-menu');
contextMenu({
showSaveImageAs: true
});
let mainWindow;
(async () => {
await app.whenReady();
浏览 6提问于2022-03-31得票数 0
回答已采纳
为了让jQuery在我用电子(以前的Atom Shell)打开的HTML页面中正确加载和工作，我在BrowserWindow文件中创建BrowserWindow时必须禁用Node集成。
有人能告诉我什么设置node-integration: false将使我不能做我通常能够做的，如果我没有禁用它？
浏览 2提问于2015-04-25得票数 11
回答已采纳
我的主要问题是我不能想出一种方法将jQuery注入到加载在电子BrowserWindow中的外部web中 到目前为止，我已经能够通过使用BrowserWindow中WebPreferences的“预加载”属性将本地脚本注入到页面中 webPreferences: {
preload: path.join(__dirname, 'js/myscript.js')
}, 到目前为止，这是可行的，没有任何问题。然而，当我尝试加载jQuery时，它并不起作用，因为很明显，当“文档”被调用时“文档”还没有准备好。 我尝试了其他的解决方案(我不怀疑
浏览 16提问于2019-02-16得票数 0
3回答
我正在使用远程url创建一个 BrowserWindow，因此我不能真正使用var ipc = require('ipc');语法来包含ipc。可以从远程url向电子主进程发送消息吗？如果是这样的话，我可以从哪里获得它的javascript源代码？
或者也许有更好的方法将信息传递给电子主进程？只需要发送登录的用户信息。
浏览 1提问于2015-11-05得票数 6
简单的问题是，我试图使用电子，我需要得到客户端的remote对象。
正在做什么
const {BrowserWindow} = require('electron').remote; // Works
但
import {BrowserWindow} from 'electron/remote' // Does not work
ES6类的新手只是不知道为什么这不起作用。谢谢。
浏览 2提问于2016-10-05得票数 8
回答已采纳
当初始BrowserWindow加载时，我试图将焦点放在电子控件上。
我知道有其他方法可以通过jQuery、JavaScript等来实现这一点，但是电子框架是否提供了一些特定的东西呢？
我试图使用jQuery/JavaScript来集中控制，但它们似乎在电子中不起作用。
下面是我在JS文件app.js中设置电子的代码:-
const electron = require('electron');
const path = require('path');
const app = electron.app;
const BrowserWindow = electr
浏览 0提问于2019-03-25得票数 0
1回答
我做了我的第一次尝试，并希望使用电子apis的角度渲染过程。我按照指示进
因此，在我的main.js文件中，我添加了：
const {app, BrowserWindow, ipcMain} = require('electron')
我还补充说
function openModal(){
const { BrowserWindow } = require('electron');
let modal = new BrowserWindow({ parent: mainWindow, modal: true, show: false })
moda
浏览 9提问于2021-03-15得票数 1
1回答
将电子应用程序从电子8.2.5更新到9.0.0后，终端中开始出现以下错误：
[1] (electron) 'BrowserWindow.addDevToolsExtension' is deprecated and will be removed. Please use 'session.loadExtension' instead.
[1] Added Extension: [object Object]
[1] (electron) 'BrowserWindow.getDevToolsExtensions' is deprecated an
浏览 6提问于2020-05-19得票数 11
我正在创建电子应用程序，它从API中命中端点，并在页面上显示响应。由于电子将主进程与呈现程序进程分离，所以我必须使用预加载脚本在两个进程之间进行通信，这样我就可以在加载时更新页面。我使用jQuery AJAX对API进行异步调用，但得到了如下错误
Uncaught Exception:
TypeError: $.ajax is not a function
at IpcMainImpl.<anonymous> (/Users/***/***/***/***/main.js:41:7)
...
我将AJAX调用放在main.js中。以下是我代码中的一些片段
main.js
const
浏览 2提问于2022-10-15得票数 0
当我学习电子时，我发现了两种获取BrowserWindow对象的方法。
const {BrowserWindow} = require('electron')
和
const electron = require('electron')
const BrowserWindow = electron.BrowserWindow
在JavaScript中，const和const {}有什么不同？
我不明白为什么const {}可以工作。我错过了关于JS的任何重要的东西吗？
浏览 162提问于2016-12-09得票数 125
回答已采纳
要禁用devTools，我们需要通过BrowserWindow访问webPreferences，但是BrowserWindow不能直接从电子应用程序获得。那么，我们如何访问webPreferences来实现devTools呢？
没有Capcitor，下面的代码片段工作得非常好
const browserWindow = new BrowserWindow({
.....
webPreferences: { devTools: false}
})
浏览 1提问于2021-06-14得票数 0
回答已采纳
我试图启动我的网站默认在IE InPrivate模式，以便我可以摆脱吨的代码，以处理多个场景(如下所列)脚本可能会在执行期间反击。我的目标是在以前的历史上没有运行浏览器等等。
Google帐户有有效的会话，并且已经注册了我们的应用程序。
谷歌帐户有有效的会话，但不用于注册我们的网络应用程序。
谷歌帐户没有会话，但还记得以前输入的电子邮件/用户。
谷歌帐户没有会话，但记得以前输入的电子邮件/用户和密码。
谷歌帐户从未登录或与我们的应用程序一起使用(最简单的情况)
注意:在BrowserWindow类中，下面的内置方法没有多大帮助。
BrowserWindow browser = BrowserW
浏览 0提问于2015-02-24得票数 4
回答已采纳
在使用之后，我不知道如何为我的电子应用程序的呈现器定义Content-Security-Policy HTTP头。我总是在DevTools中收到警告。
我试过了：
1)盲目复制/粘贴API文档中的代码：
app.on('ready', () => {
const {session} = require('electron')
session.defaultSession.webRequest.onHeadersReceived((details, callback) => {
callback({responseHea
浏览 2提问于2018-08-22得票数 28
我已经创建了角8和电子桌面应用程序。当我从根组件通过main.js向ipcRenderer电子文件发送消息时，它工作得很好。但是，当我从新生成的组件向main.js文件发送消息时，它将抛出“无法读取未定义的属性‘发送’的错误。”
下面是我的write.component.html
<button (click)="write()">Click me</button>
我的write.component.ts文件
import { Component, OnInit } from '@angular/core';
import { IpcR
浏览 0提问于2020-03-13得票数 0
在电子版本1.X中，我如何从一个BrowserWindow发出一个事件并在另一个BrowserWindow中使用它？
我使用的是电子版本1.2.1。
浏览 8提问于2016-06-02得票数 1
回答已采纳
1回答
是否可以在Firefox窗口的特定标签上使用文本输入处理器？
所有的选项卡都共享同一个nsIDOMWindow对象吗？如果是的话，还有其他解决办法吗？
重新措辞我的问题:我想键入文本到一个特定的选项卡，如果有多个，那么它可能不是当前。
下面是在任何Firefox窗口上编写文本的示例代码，但仅用于当前选项卡：
function myTestFunc() {
// var windows = Services.wm.getEnumerator("navigation:browser");
var windows = require("sdk/windows"
浏览 3提问于2016-05-29得票数 0
回答已采纳
1回答
在我的电子应用程序中，我正在设置一个webview。这是来自index.html的一个片段：
<webview
class="hide"
preload="./preload.js"
nodeintegration
></webview>
<script>
require('./renderer.js');
</script>
在main.js中，我已经为BrowserWindow设置了nodeIntegration:false，但是应用程序没有启动
浏览 2提问于2017-12-01得票数 0
1回答
电子和Asar封装应用程序
、、、、
我有一个奇怪的问题，我试图让网站离线工作(用适应力制作的电子学习课程)，所以我创建了电子应用程序包装：
main.js创建BrowserWindow，然后加载index.html
function createWindow() {
// Create the browser window.
mainWindow = new BrowserWindow({
width: 800,
height: 600,
"min-width": 800,
"min-height": 530,
浏览 3提问于2016-01-28得票数 2
我正在用Electron制作webview应用程序。
当我想使用这个插件时，无法加载。
jQuery正在使用collect，但插件不能。
如何在电子中加载插件？
代码如下。
App.js(主进程)
app.on('ready', function() {
mainWindow = new MainWindow();
mainWindow = new BrowserWindow({
width: 1480,
height: 800,
preload: __dirname + '/index.js',
"zoom-fact
浏览 0提问于2016-02-14得票数 0
1回答
最近，我想写一个带有电子和自举的应用程序。我在上使用这个代码片段。就像下面这样。
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"&g
浏览 0提问于2020-09-29得票数 0
我想用自定义按钮为我的无框架窗口添加一个自定义标题。 我有两个脚本文件- index.js，它在电子启动时自动运行，app.js，它在index.html中添加了<script src>标签。 有一个问题-- require()不让脚本工作--如果我需要任何模块，没有一行代码在运行，不管它是什么。 index.html： <head>
...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script&g
浏览 19提问于2021-10-03得票数 0
回答已采纳
我是Electron.js的新手。我正在学习一个学习电子的youtube教程，但在我的控制台上出现了这个“contextIsolation的默认设置已被弃用，在未来的电子产品版本中将从false变为true。有关更多信息，请参阅https://github.com/electron/electron/issues/23506”。我的main.js文件如下所示： const electron = require('electron');
const url = require('url');
const path = require('path&
浏览 596提问于2021-01-30得票数 3
回答已采纳
我正在使用带有多个browserWindows的电子。在这个browserWindow中，我有一个显示内容的webview。现在我想发送一个新的url到另一个打开的browserWindow的webview。
因此，我在所有的browserwindows /webview中创建了一个ipc侦听器，以便在收到请求时更新url。到目前为止，它工作得很好。我唯一不能工作的就是用新的url来聚焦/显示窗口。
我试图找到一种方法来获取webview的browserWindow实例，但这似乎是不可能的……
如何在通过IPC接收消息时显示/聚焦窗口？谢谢!
浏览 2提问于2017-06-21得票数 0
回答已采纳
1回答
我有一个桌面应用程序作为简单的浏览器工作。它有带有显示网页的网页视图的选项卡。
一些网站有选项。我真的需要它能为我的用户提供。
在一般的浏览器(例如，chrome)中，当您通过Facebook登录时，它会创建带有社会授权表单的新窗口。提交此表单后，新窗口将关闭，父窗口将接收回调代码，重新加载并登录。
在我的应用程序中，当你尝试做同样的事情时，包含网页的网页视图会用相同的形式创建新的BrowserWindow。在这一点上一切正常。当您提交表单时，新窗口将关闭，但之后不会发生任何事情。父窗口没有收到任何回调，应该运行的代码根本不会触发。或者它可能已经收到，但没有触发，因为如果我重新加载页面，它会显
浏览 2提问于2016-07-26得票数 2
我开始学习，我有一个问题：
只有当Electron从本地文件夹加载应用程序时，才能在web应用程序中使用Electron的代码吗？
win.loadURL('file://' + __dirname + '/app/index.html');
如果应用程序是从外部web服务器加载到BrowserWindow，那么在web应用程序的java脚本文件中使用电子是不可能的吗？
win.loadURL('http://localhost:9000');
浏览 0提问于2016-07-14得票数 1
2回答
我需要为我的render.js文件导入菜单。但要么遥控器是未定义的，要么我得到了一些错误。
通过下面的代码，我得到了以下错误：Uncaught TypeError: Cannot read properties of undefined (reading 'members')
我还使用.enable(webContents)方法尝试了电子文档中的一些东西，但我也无法让它工作。
这是怎么做的？
Index.js:
const { app, BrowserWindow } = require('electron');
const path = require(
浏览 3提问于2021-10-24得票数 2
我正在尝试使用child_process在电子中启动VLC const { app, BrowserWindow } = require('electron');
const child = require('child_process');
require('electron-reload')();
function createWindow () {
const win = new BrowserWindow({
width: 800,
height:
浏览 166提问于2021-01-13得票数 1
回答已采纳
我使用的是一个带有自定义标题栏的电子无框窗口，但是当右键单击它时会有一个上下文菜单。如何禁止显示此菜单？
这是电子版：
"electron": "^11.3.0",
这是电子启动program:main.js，but系统-上下文-菜单在应用程序启动后无法在这里工作。
const { app, BrowserWindow, ipcMain } = require('electron');
const path = require('path');
const url = require('url');
l
浏览 0提问于2021-04-23得票数 0
问题
我想用电子GUI自动化CLI工具(比如kubectl)。它在开发环境中运行良好。但是在生产过程中，我的应用程序无法在PATH中找到程序。
在发展中
我用的是电子中的。但是exec方法是我自己的实现。() 然后用stdout解析。
const { spawn } = require('child_process')
exports.childProcessWithResult = async function (args) {
try {
return new Promise((resolve, reject) => {
let resu
浏览 11提问于2022-05-29得票数 0
1回答
我有一个电子应用程序，其中包括以下文件：
index.js
browserwindow.html
browserwindow.js (从browserwindow.jsx编译而来)
index.js是电子应用程序启动时运行的主要电子/节点过程。browserwindow.html在guiWindow中呈现，browserwindow.js管理此窗口。(见下面的文件。)
我想要的是从主电子过程向browserwindow.js发送ipc消息，然后更新React组件状态。但是当我使用下面文件中的代码并运行电子应用程序时，状态不会改变。
index.js
const electr
浏览 0提问于2017-11-22得票数 4
回答已采纳
0回答
从电子调用窗口函数
、、、、
在我的一个.js文件中
window.functionName = function(){
}
现在我想调用主电子文件中的函数。我该怎么做呢？
下面是我在主电子文件中尝试做的事情：
const electron = require('electron');
const BrowserWindow = electron.BrowserWindow;
var focusedWindow = BrowserWindow.getFocusedWindow();
focusedWindow.functionName();
它不起作用。为什么？
浏览 11提问于2017-12-12得票数 1
回答已采纳
为什么可以用节点(电子)写这样的东西：
app.on('ready', function() {
mainWindow = new BrowserWindow({
width: 800,
height: 480
});
});
但这导致了一个错误，即app is not ready
app.on('ready', onReady());
function onReady() {
mainWindow = new BrowserWindow({
width: 800,
hei
浏览 0提问于2017-01-26得票数 0
回答已采纳
我正在尝试BrowserWindow.capturePage，但是这个函数只能截取可见页面的屏幕截图。我尝试谷歌，但没有找到如何在电子应用程序的整个网页截图？
浏览 2提问于2016-10-11得票数 4
这是一个有点探索性的问题，也许只是个bug。我们的包包括一个名为AutoLinker ()的包，它使一些复杂的正则表达式将原始字符串转换为带有<a>锚标记的字符串。
对于我来说，捆绑包在一个普通的铬选项卡中执行得很好，但是当在电子BrowserWindow i中执行时，它会导致下面的错误发生。
Uncaught SyntaxError: Invalid regular expression: /(?:[0-9Ù -Ù©Û°-۹߀-߉०-९০-৯੦-੯૦-૯à¦-à¯à¯¦-௯౦-౯೦-೯൦-൯෦-à·¯à¹-
浏览 3提问于2017-11-03得票数 2
回答已采纳
到目前为止，使用下面的代码从renderer获取当前窗口
import {remote, BrowserWindow} from 'electron';
export function getCurrentWindow(): BrowserWindow {
return remote.getCurrentWindow();
}
既然电子14已经删除了remote模块，那么新的推荐方法是什么呢？
浏览 4提问于2021-09-06得票数 1
回答已采纳
我有一个简单的电子应用程序，围绕一个网络应用程序。web应用程序提示输入用户名，但电子没有显示提示，直接转到401授权要求页面。是否需要更改设置才能显示提示符？我似乎在文档中找不到它。任何帮助都是非常感谢的。 const { app, BrowserWindow } = require('electron');
function createWindow() {
browserWindow = new BrowserWindow({});
browserWindow.loadURL('https://domain')
}
app.on(&#
浏览 29提问于2019-06-20得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
