<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <style type="text/css">
</style>
</head>
<body>
    <div class='divAll' style="width:1000px;">
        <div class='divTop'>
            <div class='top_logo'>
            </div>
            <div class='top_right'>
            </div>
        </div>
        <div style="width:1000px;height:420px;">
            <div id='divCenter' class='divCenter' style="width:400px; height:400px; background-color:Blue;float:left; border:1px solid red;">
               <iframe id="SendMsg" name="SendMsg"  width="100%" height="100%" scrolling='auto' frameborder="0" src='about:blank'></iframe>
               
            </div>
              <div id='divContent' class='divCenter' style="width:400px; height:400px;float:left; border:1px solid red;">
              
               
            </div>
        </div>
        <div class='divBottom' style="width:1000px;">
            <div class='bottom_left'>
            </div>
            <div id='div_bottom_center' class='bottom_center'>
            <a href="#" onclick="goChat('1')">跳到百度</a>
            <a href="javascript:void(0);" onclick="insertImg('http://www.baidu.com/img/baidu_jgylogo2.gif')">插入图片</a>
             <a href="javascript:void(0);" onclick="insertImg('http://www.baidu.com/img/baidu_jgylogo2.gif',117,38)">插入图片并设置大小</a>
            <a href="javascript:void(0);" onclick="insertImg('http://www.baidu.com/img/baidu_jgylogo2.gif',117,38,'http://www.baidu.com/img/baidu_jgylogo2.gif')">插入图片并添加连接</a>
           <a href="javascript:void(0);" onclick="setHtml()">设置html</a>
            </div>
            <div class='bottom_right'>
            </div>
        </div>
    </div>
</body><script type="text/javascript">var IframeSendMsg;
window.onload=function()
{
    var s=[];
    s.push('<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head>');
    if(document.frames && document.documentMode){s.push('<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>');}
    s.push('<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css">html,body{font-size:15px;padding:2px;margin:0px;background-color:#FFF;word-wrap:break-word;word-break:break-all;overflow:auto;');
    if(document.frames)
    {
       s.push('height:auto;width:96%;');
    }else{
      s.push('height:95%;width:auto;');
    }
     s.push('} p{margin:0px;padding:0px;} img{border:0px;}</style></head><body></body></html>');
      if(document.frames)
        {
            IframeSendMsg = document.frames('SendMsg');
            IframeSendMsg.document.contentEditable='true';           
        }
        else
        {
            IframeSendMsg =$('SendMsg').contentWindow;
        }  
         IframeSendMsg.document.designMode = 'On';
         IframeSendMsg.document.open();
         IframeSendMsg.document.writeln(s.join(''));
         IframeSendMsg.document.close(); 
         bindEvent(IframeSendMsg.document,'keydown',HotKeyDown);  
         IframeSendMsg.focus();  
};
     ///键盘事件
    function HotKeyDown(ev)
    {
        ev = ev || window.event;    
        if(ev==null)return false;
      
           if( ev.ctrlKey && ev.keyCode==13)
            {  
                alert("");   
            }
         return true; 
    }
    function goChat(a){
      window.location.href="http://www.baidu.com";
        return false;
    }
     
     // 绑定事件
function bindEvent(obj,evt,fun) 
{
     if(window.addEventListener){
           obj.addEventListener(evt, function(e){ fun(e);},false); 
     }else{
           obj.attachEvent('on'+evt,fun);     
    }
};   
   var $ = function (id,obj) {  
    return 'string' == typeof(id) ? (obj||document).getElementById(id) : id;   
}; 
var $C = function(name,obj){
    return 'string' == typeof(name) ? (obj||document).createElement(name):name;   
};
   function insertImg(url,w,h,linkUrl)
    {
         w=w||0;
         h=h||0;
         linkUrl=linkUrl||'';
         IframeSendMsg.focus();
        var range;
        if(IframeSendMsg.getSelection){ 
            range=IframeSendMsg.getSelection().getRangeAt(0);    
        }else if(window.document.selection){ 
            range=IframeSendMsg.document.selection.createRange();
        }
        var doc = IframeSendMsg.document || window.document;
        if(range.pasteHTML)
        {
            var s=[];
            if(linkUrl!=''){
                s.push('<a href=\''+linkUrl+'\' target=_blank>');
            }
            s.push('<img src=\''+url+'\'');
            if(w>0 && h>0){
             s.push(' width=\''+w+'px\'  height=\''+h+'px\'');
            }
            s.push('/>');
            if(linkUrl!=''){ s.push('</a>');}
            range.pasteHTML(s.join('')); 
        }else if(range)
        {
            if(linkUrl!='')
            {
                 var a = $C('a',doc);
                a.href=linkUrl;
                a.target='_blank';
                var img = $C('img',doc);
                img.src=url ;
                if(w>0 && h>0)
                {
                    img.style.width = w+"px";
                    img.style.height= h+"px";
                }
                range.surroundContents(a);
                a.appendChild(img);
                
            }else{
                var img = $C('img',doc);
                img.src=url ;
                if(w>0 && h>0)
                {
                    img.style.width = w+"px";
                    img.style.height= h+"px";
                }
                range.surroundContents(img);
            }    
        }   
    }
   function setHtml(){
     $("divContent").innerHTML=IframeSendMsg.document.body.innerHTML;
   }
   
</script></html>