当用户在这个工作javascript注释框中提交注释时，您将如何添加用户图像和名称

how would you add a user image and a name when a user submits a comment in this working javascript comments box

本文关键字：注释 用户 添加 何添加 图像 工作 javascript 提交      更新时间：2023-09-26

所以我发现了用户Rick Hitchcock在这里提交的这个评论框

当用户提交评论时，我需要做的是添加一个通用用户图像和一个用户名（可以是匿名的）。问题是我不知道该怎么做。

有人能帮忙吗？这是代码。。。。。。。

document.addEventListener("DOMContentLoaded", function(event) {
  var form= document.querySelector('form');
  var textarea= document.querySelector('textarea');
  textarea.onkeypress= function(e) {
    if(e.which === 13 && !e.shiftKey) {
      this.parentNode.onsubmit(e);
    }
  }
  form.onsubmit= function(e) {
    var textarea = form.querySelector('textarea');
    var response = textarea.value;
    var node = document.createElement('div');
    node.innerHTML= response.replace(/'n/g,'<br>') + '<hr>';
    form.appendChild(node);
    textarea.value= '';
    e.preventDefault();
  }
});
textarea {
  width: 50%;
  height: 5em;
  float: left;
}
p {
  clear: both;
}
<form>
  <textarea></textarea>
  <input type="submit">
  <p>
    Comments Below:
  </p>
</form>

我假设您希望您的网站具有某种登录功能，这样用户就可以注册、选择用户名并上传图片。也许你想保留评论，这样当用户注销或离开你的网站时，评论就不会丢失。最后但同样重要的是，你希望你的用户看到其他用户的评论。

问题是，你不能只使用HTML/Javascript/CSS来做到这一点。您需要创建一个服务器应用程序。在那里，你可以运行一个数据库，在那里你可以存储用户、评论等等。你真的应该考虑在网上做一些教程，或者读一些关于网络开发的合适的书。

我建议你做这个免费和广泛的教程。当你完成后，你将了解很多关于web和开发服务器端应用程序的知识。

编辑：

如果你真的想在不能够持久保存评论的情况下四处玩耍：那么你知道如何创建div元素：

var node = document.createElement('div');

你知道如何将它附加到另一个元素：

form.appendChild(node);

那么，为什么不创建一个img标记并将其附加到注释中呢？

var img = document.createElement("img");
img.src = "path/to/your/generic/image.jpg";
node.append(img);

或者你可以从像这样的api中得到一个随机图像。创建一个p-tag或span标签或其他任何东西来显示随机用户名。

相关文章：