在可编辑div中插入文字或图片解决思路与实现步骤

2020-05-06 08:58:29易采站长站整理

{
var ta = divlist.item(i);
if (window.getComputedStyle(ta, null).zIndex!=null && window.getComputedStyle(ta, null).zIndex == 100) {
if(ta.id && ta.id!=null)
lastFocusID=ta.id.toString();
else
lastFocusID=””;
break;
}
else
lastFocusID=””;
}
}
//再加入一个全屏事件
<PRE class=javascript name=”code”> $(window).click(function(e)
{
if (window.getSelection)
{
var getevent=e.srcElement?e.srcElement:e.target;//不要告诉我不知道这句的意思
if(getevent.tagName==”INPUT” && getevent.id!=null && getevent.id==”cmdInsert”)
{
//代表 点了插入html的按钮
//则不执行getFocus方法
&nbsp;}
else
getFocus();//除非点了那个插入html的按钮 其他时候必须要执行getFocus来更新最后失去焦点的div
}
})</PRE>

<P></P>
<PRE></PRE>

&nbsp; 然后修改一下 insertHTML 这个方法 <PRE class=javascript name=”code” sizcache=”0″ sizset=”8″> function insertHTML(html)
{
var dthis=$(“#div3”)[0];
var sel, range;
if (window.getSelection)
{
if(lastFocusID!=”div3″)
{
<PRE class=javascript name=”code”> $(“#div3).html(dthis.innerHTML+html) ;//说明 用户可能在其他控件上 进行焦点或者其他操作 则</PRE> return;//后面不执行了

}

。。。。。。。。。。//其他代码照旧

<PRE></PRE>

&nbsp;&nbsp;&nbsp; 这样就解决火狐或者chrome里面 会出现乱插入内容的现象。
<P></P>
<P>

</P>
<P>&nbsp;&nbsp; 当然这只是一个思路, 欢迎大家提供更好的办法和性能更高的思路。

</P>
<P>

</P>
</PRE></PRE>