使用 javascript 或 PHP 的 HTML 日志系统

Question

您好，我尝试为我的网站制作一个日志系统面板。该代码工作正常，因为如果您将文本写入输入字段，它就会显示出来。但如果您重新加载页面，它就会消失。所以我的问题是消失的文字。我想在输入文本时执行此操作，以便页面刷新时文本不会消失。知道如何做到这一点吗？我也想这样做，如果您在输入字段中输入文本并按添加按钮，您输入的文本将显示在其他页面上。我的意思是 /log/edit/index.html 中有一个页面，并且文本应该出现在 /log/view/index.html 站点上。我知道这基本上是不可能的任务，但我认为如果您在文本字段中输入的文本进入 .txt 文件并将其保存到 /log/logs.txt 然后 /log/view/index.html 读取，这可能是可能的它并显示 txt 文件中的文本。

function newElement() {

  var li = document.createElement("li");

  var inputValue = document.getElementById("myInput").value;

  var t = document.createTextNode(inputValue);

  li.appendChild(t);

  if (inputValue === '') {

    alert("Invalid log! You must write something");

  } else {

    document.getElementById("myUL").appendChild(li);

  }

  document.getElementById("myInput").value = "";

}

ul {

margin: 0;

padding: 0;

}

/* Style the list items */

ul li {

cursor: pointer;

position: relative;

padding: 12px 8px 12px 40px;

list-style-type: none;

background: #eee;

font-size: 18px;

transition: 0.2s;

/* make the list items unselectable */

-webkit-user-select: none;

-moz-user-select: none;

-ms-user-select: none;

user-select: none;

}

/* Set all odd list items to a different color (zebra-stripes) */

ul li:nth-child(odd) {

background: #f9f9f9;

}

/* Darker background-color on hover */

ul li:hover {

background: #ddd;

}

/* Style the header */

.header {

background-color: #0d1426;

padding: 30px 40px;

color: white;

text-align: center;

}

/* Clear floats after the header */

.header:after {

content: "";

display: table;

clear: both;

}

/* Style the input */

input {

margin: 0;

border: none;

border-radius: 0;

width: 75%;

padding: 11px;

float: left;

font-size: 16px;

}

/* Style the "Add" button */

.addBtn {

padding: 13px;

width: 250px;

background: #d9d9d9;

color: #555;

float: left;

text-align: center;

font-size: 16px;

cursor: pointer;

transition: 0.3s;

border-radius: 0;

border-bottom: 1px solid transparent;

}

Answer 1

如果您想将日志保存到 txt 文件中，请查看此文件和https://www.geeksforgeeks.org/javascript-program-to-write-data-in-a-text-file/

Answer 2

我不确定您为什么需要此功能，但这不是重点。除了可能在用户每次按下按键时将值存储在XML文件中，然后在刷新时加载XML文件之外，没有真正的方法可以做到这一点。