walkuere 2024-01-12 14:53 采纳率: 55.6%
浏览 8
已结题

jsp的modal弹窗页面如何单独写一个html里？

因为公司项目用的非主流框架，所以弹窗的代码是固定的，就是把一段js插入到html的body里然后用他们的固定函数预存

html基本静态
现在我想把页面内容和弹窗内容彻底分开，就是希望写一个弹窗的html，然后js直接把这个html的文本全部读到js中作为一个字符串变量，然后合并到页面里，用框架给的函数显示
最好就是html写在html或者jsp里，而不是在js里，在js里看不清syntax

  • 写回答

2条回答 默认 最新

  • 一休哥助手 2024-01-12 16:09
    关注

    img


    该回答引用一休哥助手
    你可以在HTML或JSP文件中编写一个包含弹窗内容的隐藏的<div>元素，并使用JavaScript将其内容读取为字符串，然后将其合并到页面中。以下是一个简单的示例：

    在HTML或JSP文件中，创建一个包含弹窗内容的隐藏<div>：

    <!-- 弹窗内容放在这个隐藏的div中 -->
<div id="myModal" style="display: none;">
  <h2>弹窗标题</h2>
  <p>弹窗内容在这里</p>
  <!-- 其他弹窗内的内容 -->
</div>

    然后，在JavaScript中读取这个<div>的内容并将其合并到页面中：

    // 读取弹窗内容
var modalContent = document.getElementById('myModal').outerHTML;

// 在页面中插入弹窗内容
document.body.insertAdjacentHTML('beforeend', modalContent);

    在上述代码中，getElementById('myModal').outerHTML获取了<div>的完整HTML内容，然后使用insertAdjacentHTML将其插入到页面的<body>末尾。

    请注意，这只是一个简单的示例，你可能需要根据实际情况进行调整和改进。在实际项目中，确保在使用JavaScript将内容插入到页面时，考虑到安全性和潜在的XSS攻击。

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题？

问题事件

  • 系统已结题 1月24日
  • 已采纳回答 1月16日
  • 修改了问题 1月12日
  • 创建了问题 1月12日

悬赏问题

  • ¥20 易康econgnition精度验证
  • ¥15 线程问题判断多次进入
  • ¥15 msix packaging tool打包问题
  • ¥28 微信小程序开发页面布局没问题，真机调试的时候页面布局就乱了
  • ¥15 python的qt5界面
  • ¥15 无线电能传输系统MATLAB仿真问题
  • ¥50 如何用脚本实现输入法的热键设置
  • ¥20 我想使用一些网络协议或者部分协议也行，主要想实现类似于traceroute的一定步长内的路由拓扑功能
  • ¥30 深度学习，前后端连接
  • ¥15 孟德尔随机化结果不一致