如何解决div样式/格式在使用show / hide时丢失
| 我在下面使用显示/隐藏代码。我工作正常,购买文本格式丢失了。反正是有防止这种情况发生的吗?我有一些标记样式和样式表编码 <div id=\"fillit\"></div>
<a href=\"javascript:void(0)\" class=\"para\">Sci Lit 1</a>
<div class=\"details\">text for sci lit 1</div>
<a href=\"javascript:void(0)\" class=\"para\">Sci Lit 2</a>
<div class=\"details\">text for sci lit 2</div>
<a href=\"javascript:void(0)\" class=\"para\">Sci Lit 3</a>
<div class=\"details\">text for sci lit 3</div>
<style>
.inner-boxes .box3,.details1 {display:none;}
</style>
<script>
$(function(){
$(\".para\").click(function(){
$(\"#fillit\").text($(this).next(\".details1\").text());
});
$(\".details1:first\").clone().appendTo(\"#fillit\").show();
});
</script>
解决方法
使用.html()而不是.text()
更改:
$(\"#fillit\").text($(this).next(\".details1\").text());
至:
$(\"#fillit\").html($(this).next(\".details1\").html());
这是一个例子
,在脚本中,您具有:
$(\".para\").click(function(){
$(\"#fillit\").text($(this).next(\".details1\").text());
});
改成:
$(\".para\").click(function(){
$(\"#fillit\")
.children(\".details1\")
.replaceWith(
$(this).next(\".details1\").clone().show()
);
});
.text()
仅获取元素的内部文本
注意:正如注释中所指出的,这不是唯一的方法,甚至可能不是最快的方法。 (我自己尚未对其进行任何测试),但在我看来,这全都与风格有关。
我回答的优点是该解决方案可以在许多不同的情况下工作。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。