Ich weiß nicht, wie ich Text in einem Div mit der Einstellung „ContentEditable="true"“ speichern soll?
Grundsätzlich bin ich sehr naiv, was HTML- und CSS-Codierung angeht, und JS übersteigt meine Fähigkeiten bei weitem. Allerdings ist es mir gelungen, mithilfe von HTML und CSS eine Art Zeitplan zu erstellen.
Das Problem ist, dass ich nicht weiß, wie ich dafür sorgen kann, dass der in einem div in HTML platzierte Text (wobei contenteditable auf „true“ gesetzt ist) bestehen bleibt und angezeigt wird, wenn die HTML-Datei das nächste Mal im Browser geöffnet wird.
Ich werde meine Anwendung nur in localhost verwenden und möchte keine Datenbank verwenden.
Ich freue mich auf Ihr Fachwissen und Ihre freundliche Hilfe. Die erforderlichen Informationen lauten wie folgt:
.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>
Hinweis: Der angegebene Codeausschnitt ist Teil eines größeren Projekts. Ignorieren Sie daher bitte die Grafikunterschiede.
Hier ist ein Bild des Projekts, an dem ich arbeite: -Wir müssen das Kästchen in der unteren rechten Ecke reparieren
Ich habe versucht, online nach vielen Lösungen zu suchen, konnte aber keine finden. Ich freue mich aufrichtig auf Ihre Hilfe.
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
你需要一个数据库，我知道没有数据库就没有办法做到这一点，如果你在 SQL 方面遇到问题，你可以使用 Excel，否则除了使用数据库之外我没有解决方案