带有 javascript 或 php 的 HTML 日志系统答案

【问题标题】：HTML Log System with javascript or maybe php带有 javascript 或 php 的 HTML 日志系统
【发布时间】：2021-03-06 12:33:41
【问题描述】：

您好，我尝试在我的网站上创建一个日志系统面板。该代码工作正常，因为如果您将文本写入输入字段，它将显示出来。但是，如果您重新加载页面，它将消失。所以我的问题是消失的文字。我想在输入文本时执行此操作，以便在页面刷新时它不会消失。知道怎么做吗？如果您在输入字段中输入文本并按下添加按钮，我也想这样做，您输入的文本将出现在其他页面上。我的意思是 /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;
}

.addBtn:hover {
background-color: #bbb;
}

    <div class="addlog">
        <div id="myDIV" class="header">
          <h2 style="margin:5px">Update Logs</h2>
          <input type="text" id="myInput" placeholder="Log" maxlength="112">
          <span onclick="newElement()" class="addBtn">Add</span>
        </div>

        <ul id="myUL">

        </ul>
    </div>

【问题讨论】：

标签： javascript php html css apache

【解决方案1】：

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

【讨论】：

【解决方案2】：

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

【讨论】：