jquery - 在 jQuery 中克隆一个选择器+它的所有子元素?

标签 jquery jquery-selectors

我无法让以下 JQuery 脚本正常运行 - 其功能如下:

1) 隐藏每个标题下方的内容

2)点击标题后,将“#first-post”替换为标题+标题下方的隐藏内容。

我似乎只能让脚本将标题本身克隆到#first-post,而不是标题及其下面的内容。知道为什么吗?

<HTML>
<HEAD>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</HEAD>
<script>
$(document).ready(
function(){ 
$('.title').siblings().hide();
$('.title').click( function() {
$('#first-post').replaceWith($(this).closest(".comment").clone().attr('id','first-post'));
$('html, body').animate({scrollTop:0}, 'fast');
return false;
});
});
</script>
<BODY>
<div id="first-post"> 
  <div class="content"><p>This is a test discussion topic</p> </div> 
</div>
<div class="comment"> 
<h2 class="title"><a href="#1">1st Post</a></h2> 
  <div class="content">
    <p>this is 1st reply to the original post</p> 
  </div> 
  <div class="test">1st post second line</div>
  </div>
<div class="comment"> 
<h2 class="title"><a href="#2">2nd Post</a></h2> 
  <div class="content"> 
    <p>this is 2nd reply to the original post</p> 
      </div> 
  <div class="test">2nd post second line</div>
  </div> 
</div>
<div class="comment"> 
<h2 class="title"><a href="#3">3rd Post</a></h2> 
  <div class="content"> 
    <p>this is 3rd reply to the original post</p> 
  </div> 
  <div class="test">3rd post second line</div>
    </div> 

</div>

</BODY>
</HTML>

最佳答案

您正在克隆隐藏元素,因此副本也被隐藏。在其中添加对 show() 的调用。

关于jquery - 在 jQuery 中克隆一个选择器+它的所有子元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2664052/

相关文章:

jquery - 这些jquery选择器语句有什么区别

jquery - 将数据传递到 Bootstrap 模式

javascript - Select2 自定义渲染

javascript - 使用 eq(0) 和不使用它的区别

jquery - jQuery 尖括号选择器看起来是什么,比如 $ ('<img/>' )?

javascript - 是否可以选择 $(this) + $ ('#Example' )?

javascript - jquery中的多选复选框

php - 当jquery-file-upload中的DB值 "position"等于 "id"时,如何插入数据

php - 如何使用 jQuery 在屏幕上设置值而不是使用警报?

jquery - 选择此标记中的第一个文本节点