主页 / 问题 / 814942
Accepted
Tick-Tack
Asked:2020-04-16 19:21:45 +0000 UTC2020-04-16 19:21:45 +0000 UTC

上面有一个来自 js 的插入（前置）html

  • 772

我有一个表单，提交时，我需要输入的数据出现在页面上。它们在页面上显示如下： 有一个wrap包含评论的块（可以有很多）。评论的正文是ol. 你能告诉我为什么插入没有发生吗？

$(document).ready(function() {
  $("#wrap").prepend("<ol class='comments-list'><li class='comment'><div class='activity_rounded'></div><div class='comment-body'><h4 class='text-left'>Name<small class='date-posted'></small></h4><p>Text</p><a href='#leave_comment' class='pull-left reply'>Reply</a><div class='clearfix'></div></div></li></ol>");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="wrap">
  <ol class="comments-lists">
    <li class="comment">
      <div class="activity_rounded"></div>
      <div class="comment-body">
        <h4 class="text-left">
          <span id="author-name">Name<span><small class="date-posted">Date</small>
                  </h4>
                  <p>Text</p>
                  <a href="#leave_comment" class="pull-left reply">Reply</a>
    	      <div class="clearfix"></div>
    	    </div>
            </li>
        </ol>
</div>

javascript

1 个回答

  1. Best Answer

    因为您有一个带有 class 的元素 .wrap，而不是 id #wrap。

    仔细查看选择器。

    $(document).ready(function() {
  // поиск по классу
  $(".wrap").prepend("<ol class='comments-list'><li class='comment'><div class='activity_rounded'></div><div class='comment-body'><h4 class='text-left'>Name<small class='date-posted'></small></h4><p>Text</p><a href='#leave_comment' class='pull-left reply'>Reply</a><div class='clearfix'></div></div></li></ol>");
});
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="wrap">
  <ol class="comments-lists">
    <li class="comment">
      <div class="activity_rounded"></div>
      <div class="comment-body">
        <h4 class="text-left">
          <span id="author-name">Name<span><small class="date-posted">Date</small>
                  </h4>
                  <p>Text</p>
                  <a href="#leave_comment" class="pull-left reply">Reply</a>
    	      <div class="clearfix"></div>
    	    </div>
            </li>
        </ol>
</div>

    • 3

相关问题