Javascript/jquery :只更新div (不包括外部)中的内容--包括html和css，并提供实时预览
Javascript/jquery :只更新div (不包括外部)中的内容--包括html和css，并提供实时预览
提问于 2014-01-18 09:07:30
我不确定这是否可行，但基本上我是在对输入到textarea中的html和css进行实时预览，并将其显示在div (#previewStyle)中。我正在使用.keyup通过javascript/jquery展示这一点。
$(function(){
$(".updatepreview").keyup(function(){
$.post( "<?php echo http() . $websitedomain .'/.../.../styles.php'; ?>", $("#styles_form").serialize(), function(result_data){ $("#previewStyle").html(result_data); /* use result data here */ } );
});问题是:当它加载css时，它会更新页面上的所有内容(甚至在div之外)。有没有办法将jquery限制为只使用div？如果有必要，我可以进入并更改div之外的所有id和类，以确保没有冲突；但是，我想先在这里检查一下解决方案。一个textarea包含css，一个textarea包含html，并通过以下方式序列化并加载它们：
<?php echo "
<html>
<head>
<style> ".$_POST['style']."</style>
</head>
<body>".$_POST['html']."</body>
</html>";
?>更新：
预览div确实正确显示；但是预览div内部的css更新并覆盖预览div之外的css。我试图确定是否有办法将预览div中的css限制在预览div中，而不是让它覆盖预览div周围页面的主样式表。
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-01-18 10:45:59
将内容放入iframe中，以便独立于主文档进行处理。
有关将JQuery Loading Content of textarea into IFrame和CSS加载到iframe中的详细信息，请参见。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21202153
复制相关文章
相似问题
腾讯云开发者
