您的位置：首页 > 其它

让iframe可编辑

2015-09-24 18:09 232 查看

function EnableEdit()
{
var editor;
editor = document.getElementById("HtmlEdit").contentWindow;
// 针对IE浏览器, make it editable
editor.document.designMode = 'On';
editor.document.contentEditable = true;
// For compatible with FireFox, it should open and write something to make it work
editor.document.open();
editor.document.writeln('<html><head>');
editor.document.writeln('<style>body {background: white;font-size:9pt;margin: 2px; padding: 0px;}</style>');
editor.document.writeln('</head><body></body></html>');
editor.document.close();
}

<iframe  ID="HtmlEdit" MARGINHEIGHT="1" MARGINWIDTH="1" width="100%" height="312">
</iframe>

<iframe src="" name="editor" id="editor" style="border: 1px solid rgb(204, 204, 204);" frameborder="0" height="200" width="400"></iframe>

<div>
<input type="button" onclick="insert(1)" value="insert image">
<input type="button" onclick="insert(2)" value="insert text">
</div>

<script>
_win=$('#editor')[0].contentWindow; // 我们用 _win 变量代替 iframe window
_doc=_win.document;                        // 用 _doc 变量代替 iframe的document
_doc.designMode = 'On';

if( $.browser.msie ){
_doc.write('<img src="pet_store_api.png">');
}else{
_doc.open();
_doc.write('<img src="pet_store_api.png">');
_doc.close();
}

function insertHTML( sHtml )
{
_win.focus();
if(   $.browser.msie ){
_doc.selection.createRange().pasteHTML( sHtml ) ;
}else{
_doc.execCommand( 'InsertHtml' , '' , sHtml );
}

}
function insert(type){
if(type==1){
insertHTML( '<img src="pet_store_api.png">' );
}else{
insertHTML( 'haha' );
}
}
</script>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航