gpt4 book ai didi

javascript - 在Javascript html CSS中将模态与 Electron js中的模态相同吗?

转载 作者:行者123 更新时间:2023-12-03 12:41:31 26 4
gpt4 key购买 nike

我试图做到这一点,以便当我按下按钮时,出现一个模态。但是,我遇到了麻烦,因为它无法在我的Java脚本文件功能中使用。我已经把html和css的部分放下来了,但是我不确定如何使javascript工作。我开始怀疑这 Electron js东西与通常的javascript东西是否不同。

Javascript:

const { app, BrowserWindow, Menu} = require('electron')
const path=require('path')
const url=require('url')

function createWindow () {
// Create the browser window.
const mainWin = new BrowserWindow({
width: 800,
height: 600,
resizable:false,
webPreferences: {
nodeIntegration: true
}
})

// and load the index.html of the app.
mainWin.loadFile('index.html')


// Open the DevTools.
//win.webContents.openDevTools()

var menu = Menu.buildFromTemplate([
{
label: "Menu",
submenu: [
{label: 'Exit',
accelerator: process.platform == 'darwin' ? 'Command+Q' :
'Ctrl+Q',
click(){
app.quit();
}
}
]
},
{
label: 'Classes',
submenu: [
{label: 'Add Classes'},
{label: 'Manage Classes'}
]
},
{
label: 'Reply Slips',
submenu: [
{label: 'Add Reply Slips'},
{label: 'Manage Reply Slips'}
]
}
])
Menu.setApplicationMenu(menu);
}

// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.whenReady().then(createWindow)

// Quit when all windows are closed.
app.on('window-all-closed', () => {
// On macOS it is common for applications and their menu bar
// to stay active until the user quits explicitly with Cmd + Q
if (process.platform !== 'darwin') {
app.quit()
}
})

app.on('activate', () => {
// On macOS it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (BrowserWindow.getAllWindows().length === 0) {
createWindow()
}
})

// In this file you can include the rest of your app's specific main process
// code. You can also put them in separate files and require them here.

最佳答案

我在以下问题中找到了解决方案:Electron: jQuery is not defined

您只需要复制该内容并替换为js。

例子:

index.html

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="bootstrap.min.css">
</head>

<body>
<!-- Trigger the modal with a button -->
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>

<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">

<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title">Modal Header</h4>
</div>
<div class="modal-body">
<p>Some text in the modal.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>

</div>
</div>
</body>

<!-- Insert this line above script imports -->
<script>
if (typeof module === 'object') {
window.module = module;
module = undefined;
}
</script>

<!-- normal script imports etc -->
<script src="jquery-3.4.1.js"></script>
<script src="bootstrap.min.js"></script>

<!-- Insert this line after script imports -->
<script>
if (window.module) module = window.module;
</script>

</html>

关于javascript - 在Javascript html CSS中将模态与 Electron js中的模态相同吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60386871/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com