页面框的弹框

太过爱你忘了你带给我的痛 2024-03-16 23:53 48阅读 0赞

以下是使用JSP和JavaScript实现您要求的代码：

<!DOCTYPE html>  
<html>  
<head>  
<title>弹框示例</title>  
<script type="text/javascript">  
window.onload = function() \{  
var popup = document.getElementById("popup");  
popup.style.display = "block";  
\}

function closePopup() \{  
var popup = document.getElementById("popup");  
popup.style.display = "none";  
\}  
</script>  
<style type="text/css">  
.popup \{  
position: fixed;  
top: 50%;  
left: 50%;  
transform: translate(-50%, -50%);  
background-color: \#ffffff;  
border: 1px solid \#cccccc;  
padding: 20px;  
display: none;  
\}

.popup button \{  
background-color: \#4CAF50;  
color: \#ffffff;  
border: none;  
padding: 10px;  
text-align: center;  
text-decoration: none;  
display: inline-block;  
font-size: 16px;  
margin: 4px 2px;  
cursor: pointer;  
float: right;  
\}  
</style>  
</head>  
<body>  
<div id="popup" class="popup">  
<p>我10:00-10:30 11:00-11:30 开会，来找我的话麻烦避开这两个时间段，另外，不提交作业的话视为当天没有完成作业，每月底评价前我会提交记录给部长。</p>  
<button οnclick="closePopup()">确认</button>  
</div>  
</body>  
</html>

解释一下以上代码的功能：

1.  首先使用HTML和CSS创建一个弹框，它被设置为初始状态下不可见。
2.  在JavaScript中，当页面加载时会调用window.onload函数来显示弹框。
3.  当用户点击确认按钮时，调用closePopup函数来隐藏弹框。

请注意，以上示例只是实现了基本的弹框显示和关闭功能，您需要根据自己的需求进行修改和扩展。

发表评论取消回复

表情：

评论列表（有 0 条评论，48人围观）

还没有评论，来说两句吧...

相关阅读

相关页面框的弹框

以下是使用JSP和JavaScript实现您要求的代码： <!DOCTYPE html> <html> <head> <title>弹框示例</title>

太过爱你忘了你带给我的痛/ 2024年03月16日 23:53/ 0 赞/ 49 阅读

相关 java工作复习——JavaScript的3个弹框对比总结——JavaScript的Alert弹框——confirm弹框 ——prompt弹框...

引入包：import org.openqa.selenium.Alert; js的alert弹框 Alert alert = driver.switchTo().al

冷不防/ 2023年10月03日 17:03/ 0 赞/ 183 阅读

相关关闭layui弹框，不会关闭弹框页面中的WdatePicker日期选择框

关闭layui弹框，不会关闭弹框页面中的WdatePicker日期选择框问题描述：当前页面A，通过layer.open打开页面B，页面B中引入WdatePicker控件;

红太狼/ 2023年07月25日 11:19/ 0 赞/ 127 阅读

相关删除弹框

if (selectedRowsState && selectedRowsState.length > 0) { confirm({

╰+攻爆jí腚メ/ 2022年12月23日 00:35/ 0 赞/ 304 阅读

相关 layui 弹框

信息框(msg、alert、open、confirm) icon:0 ![97c281a75adf80a3f6b2f8efd4a0abc7.png][] icon:1

旧城等待，/ 2022年09月10日 14:23/ 0 赞/ 363 阅读

相关 JSP/HTML页面弹出框

需求：项目中要求点击某个按钮，弹出一个对话框，输入数据，提交。首先来分析一下，在A页面输入N多数据，然后点击提交按钮，弹出一个新的对话框B，对话框B里也要输入N多数据，在

怼烎@/ 2022年07月15日 14:54/ 0 赞/ 448 阅读

相关 layui本页面弹框、表格写法

var src_,departmentDate=[],groupDate=[],terminalStateDate=[],devTypeDate=[],form,lay

待我称王封你为后i/ 2022年05月15日 02:06/ 0 赞/ 564 阅读

相关【Angular】弹框

一、Module中操作： import {DialogModule} from 'primeng/primeng'; import {ButtonModule

痛定思痛。/ 2022年05月07日 23:36/ 0 赞/ 456 阅读

相关 JavaScript弹框

注意：弹窗使用反斜杠来换行![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG

系统管理员/ 2022年04月12日 05:40/ 0 赞/ 465 阅读

相关 js弹框

1.引入jquery.min.js 2.上代码 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">

雨点打透心脏的1/2处/ 2022年03月22日 03:09/ 0 赞/ 771 阅读