javascript - 我正在创建一个社交媒体网站，我需要让用户动态发布

<分区>

代码应该使用 js 动态添加一个新的文章元素。这是我的代码，但它不起作用。

js 在用户点击发布按钮后在页面上创建文章。 `

document.getElementById("post-button").onclick = createPost();
var el = document.getElementById("post-button");
if (el.addEventListener)
    el.addEventListener("click", createPost(), false);
else if (el.attachEvent)
    el.attachEvent('onclick', createPost());


function createPost(){
    var article = document.createElement("article");
    article.setAttribute("id", "myarticle");
    article.className = "posts";

    var p = document.createElement("p");
    p = document.getElementByID("posting-area").value;




    // test case, append the content
    document.body.appendChild(article);
    document.getElementById("myarticle").appendChild(p);

}

供用户输入帖子文本的 html。

<article class="posts">
               <img class="peopletofollowimg" src=Profile.jpg alt="View Profile Picture">
                <textarea id="posting-area" rows="6" cols="90" placeholder="Share Your Thoughts!">
                </textarea>
                    <button onclick="createPost()" id="post-button">Post!</button>


            </article>

最佳答案

我发现您的代码存在许多问题。首先，您将 p 元素附加到 ID 为 myarticle 的元素，但 myarticle 不存在于您的 html 片段中。您可能没有这样做。

另外，document.getElementByID("posting-area").value() 是错误的。它应该是 getElementById("posting-area").value()。去掉getElementByID中的大写D。

最后，你需要换行

var p = document.createElement("p");
p = document.getElementById("posting-area").value;

到

var p = document.createElement("p");
p.innerHTML = document.getElementById("posting-area").value;

这是一个有效的 jsfiddle

关于javascript - 我正在创建一个社交媒体网站，我需要让用户动态发布，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34445647/

上一篇：javascript - 在我的网站上编写基于 GUI 的 Markdown 编辑器

下一篇：html - 将页脚放在底部？

javascript - 在 HTML 文件输入元素中仅显示 XML 文件

c# - 我可以在关闭连接后保留 SqlDataReader "alive"吗？

javascript - 如何从 JavaScript 执行 asp.net 按钮单击事件？

javascript - 动态宽度的 Div 大小调整为 float 顶部的 div 的动态数量

html - 在所有浏览器中使用 column-count 时避免 paragraf 被破坏

c# - asp.net 使用 javascript 隐藏下拉列表中的特定项目

python-3.x - 在 python 中即时编译字符串函数？

javascript - 动画原生延迟加载图像(加载 ='“lazy” )

html - 将导航栏搜索表单和按钮与 Bootstrap 4 中心对齐