Question

如何使用js（或js / jquery）为某些div元素添加注释？

例如：

我有一张表格：

<form action="#" id="create" method="post">
    <fieldset>

    <legend><strong>Add your comment</strong></legend>

    <p>
        <label for="author">Name <abbr title="Required">*</abbr></label>
        <input name="author" id="author" value=""
        required="required" aria-required="true"
        pattern="^([- wdu00c0-u024f]+)$"
        title="Your name"
        type="text" spellcheck="false" size="20" />
    </p>

    <p>
        <label for="email">Email <abbr title="Required">*</abbr></label>
        <input name="email" id="email" value=""
        required="required" aria-required="true"
        pattern="^(([-wd]+)(.[-wd]+)*@([-wd]+)(.[-wd]+)*(.([a-zA-Z]{2,5}|[d]{1,3})){1,2})$"
        title="Your email address"
        type="text" spellcheck="false" size="30" />
    </p>

    <p>
        <label for="text">Comment <abbr title="Required">*</abbr></label>
        <textarea name="text" id="text"
        required="required" aria-required="true"
        title="Your comment"
        spellcheck="true" cols="40" rows="10"></textarea>
    </p>

    </fieldset>
    <fieldset>

    <button name="preview" type="submit">Preview</button>
    <button name="save" type="submit">Submit Comment</button>

    </fieldset>

</form>

<div id="comments"></div>

之后我尝试提交此表单，并在提交后将textarea内容添加到放置在表单旁边的div元素。显然，如果没有页面重新加载，我就无法做到。

你能帮我解决这个问题吗？

Answer 1

使用纯JS：

document.getElementById('comments').innerHTML = 'Form sent!';

使用jQuery：

$('#comments').html('Form sent!');

Answer 2

将以下javascript函数添加到页面代码

<script>
 function updateComment()
  {  
   document.getElementById("comments").innerHTML = document.getElementById("text").value;
  }
</script>

并在＆＃34; Onclick＆＃34;上调用此功能。＆＃34;提交评论＆＃34;按钮

<button name="save" type="submit" onclick="updateComment()">Submit Comment</button>

使用纯js向div添加注释

2 个答案: