私は、プレビュー目的のために私のモーダルに完全なhtml電子メール（オープニングとクローズドHTMLタグ付き）をロードしています。このように：ブートストラップ・モーダル内にロードされたhtmlがページhtmlに影響しないようにするにはどうすればよいですか？
//Update modal body
$('.modal-body').html(response['html']);
私がいる問題は、私はこれを行う際に、ロードされたHTMLは（当然）モーダルの外側のメインページの内容を変えたようだったということです。
私は、メインページのhtmlに影響を与えないように、htmlをモーダル領域だけに分離する方法があるかどうか疑問に思っています。
これに代わってiframeを使用してみましたが、問題は私がこのデータをajax（他のデータとともに）に読み込んでいることです。iframeはリンク急いで。
私はここに潜在的な解決策をありがとうと思います。
ありがとうございます！
これらは、サンドボックス化されているためにここでは機能しないかもしれませんが、これは私にとってはローカルで動作します。
var target = document.getElementById('target');
var targetDoc = target.contentWindow.document;
targetDoc.open('text/htmlreplace');
targetDoc.write("<html><body>Hello world</body></html>");
targetDoc.close();<iframe id="target"></iframe>いたよう：
var target = document.getElementById('target');
target.src = "javascript:'<html><body>Hello world</body></html>'";<iframe id="target"></iframe>私は第二の例を認識しますが賢明な引用符を管理しにくいかもしれません。
ここでは、完全に動作するブートストラップの例を示します。それはローカルで動作しますが、このサンドボックスでは動作しません。
var target = document.getElementById('target');
var targetDoc = target.contentWindow.document;
targetDoc.open('text/htmlreplace');
targetDoc.write("<html><body>Hello world</body></html>");
targetDoc.close();<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Launch demo modal
</button>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
<iframe id="target"></iframe>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>それはサンドボックスでそれがローカルにこのようにレンダリング失敗したけど...
Tapha：
代わりのjqueryの、あなたが試すことができます次のコード：
<div>
<object type="text/html" data="http://www.google.com/" width="800px" height="600px" style="overflow:auto;border:5px ridge blue">
</object>
</div>
希望します。
可能な複製：http://stackoverflow.com/questions/16504816/how-to-set-html-content-into-an-iframeおよび/またはhttp://stackoverflow.com/questions/8226307/set -iframe-inner-html-without-page-in-it-jquery – JonSG
これらのソリューションは私の目的のためには機能しません。 iframeが必要なhtmlに読み込まれていないようです。 – Tapha