我不知道如何在设置了 'ContentEditable="true"' 的 div 中保存一些文本?
基本上,我对 HTML 和 CSS 编码非常天真,而 JS 远远超出了我的能力范围。不过,我已经成功地使用 HTML 和 CSS 为自己制作了某种日程安排表。
问题是,我不知道如何使放入 HTML 中的 div 中的文本(将 contenteditable 设置为 true)保留下来,并在下次在浏览器上打开 html 文件时显示。
我将仅在本地主机中使用我的应用程序,并且不想使用任何类型的数据库。
期待你们的专业知识和友善的帮助。 所需信息如下--
.quote { width: 92%; height: 48vh; margin: 2% auto auto auto; background-color: beige; border-style: solid; border-width: 12px; border-color: aqua; display: grid; grid-template-rows: 12% auto; } .quote .p { height: 100%; margin:0 auto auto 12px; font-family: 'Montserrat', sans-serif; font-size: 12vh; background-image: linear-gradient(180deg, rgba(26,18,189,1) 51%, rgba(43,181,131,1) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .quote .p p { height: 100%; width: 100%; margin:0; } .quote .writetext { min-height: 8vmax; max-height: 19vmax; width: 25.6vmax; margin: 12px auto 12px auto; border-style: solid; border-width: 2px; border-color: white; font-family: 'Patrick Hand', cursive; font-size: 4vh; text-align: center; }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>DayMaker- Welcome</title> <link rel="stylesheet" href="styles.css"> <script src="scripts.js"></script> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Patrick+Hand&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@-1,600&display=swap" rel="stylesheet"> </head> <body> <div class="quote"> <div class="p"><p>"</p></div> <div class="writetext" contenteditable="true"> </div> </div> </body> </html>
注意:给定的代码片段是一个更大项目的一部分。因此,请忽略图形差异。
这是我正在从事的项目的图片:-我们需要修复右下角的那个框
我尝试在网上搜索很多解决方案,但找不到任何解决方案。 真诚期待您的帮助。
你需要一个数据库,我知道没有数据库就没有办法做到这一点,如果你在 SQL 方面遇到问题,你可以使用 Excel,否则除了使用数据库之外我没有解决方案