html编辑器浏览器兼容问题
在学做一个HTML编辑器。。在浏览器兼容方面发现很多不同。。。
js 代码:window.onload=function()
{
var leleHTML = document.getElementById("leleEditor").contentWindow;
leleHTML.document.designMode = "on";
leleHTML.document.contentEditable = true;
leleHTML.focus();
}
function CheckForm()
{
var leleContent = document.getElementById("leleEditor").contentWindow.document.getElementsByTagName("body")[0].innerHTML
var leleHTML = document.getElementById("leleEditor").contentWindow;
if(leleContent==""||leleContent=="<P> </P>"||leleContent=="<br>")
{
alert("请输入内容,谢谢!");
leleHTML.focus();
return false;
}
else
{
getValue(leleContent);
}
}
function getValue(content)
{
document.getElementById("content").value=content; //此处需要根据表单名字进行变换
}
//字体选择
function FontName(value)
{
var leleHTML = document.getElementById("leleEditor").contentWindow;
var leleText = leleHTML.document.selection.createRange();
if(leleText)
{
leleHTML.document.execCommand("FontName", "false", value);
}
}
//文字大小
function FontSize(value)
{
var leleHTML = document.getElementById("leleEditor").contentWindow;
var leleText = leleHTML.document.selection.createRange();
if(leleText)
{
leleHTML.document.execCommand("FontSize", "false", value);
}
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.
<html xmlns="http://www.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script language="javascript" src="Editor.js"></script>
<style type="text/css">
body{
background:#303030;
}
.leleEditor{
width:875px;
height:200px;
border:1px solid #CCCCCC;
}
.leleTools{
width:100%;
height:21px;
background:#F7F5F4;
padding:6px 0px;
border-bottom:1px solid #CCCCCC;
}
.leleIframe{
width:100%;
height:auto;
background:#FFFFFF;
}
/*工具栏设置*/
.leleMargin{
margin-left:3px;
}
</style>
<title>无标题文档</title>
</head>
<body>
<form id="form1" name="form1" method="post" action="lele.asp">
<div class="leleEditor">
<div class="leleTools">
<select name="leleFont" id="leleFont" class="leleMargin" onChange="FontName(this.options[this.selectedIndex].value)">
<option value="">字体</option>
<option value="宋体">宋体</option>
<option value="黑体">黑体</option>
<option value="楷体_GB2312">楷体</option>
<option value="仿宋_GB2312">仿宋</option>
<option value="隶书">隶书</option>
<option value="幼圆">幼圆</option>
<option value="新宋体">新宋体</option>
<option value="细明体">细明体</option>
<option value="Arial">Arial</option>
<option value="Arial Black">Arial Black</option>
<option value="Arial Narrow">Arial Narrow</option>
<option value="Courier">Courier</option>
<option value="Courier New">Courier New</option>
<option value="Script">Script</option>
<option value="System">System</option>
<option value="Verdana">Verdana</option>
<option value="Wide Latin">Wide Latin</option>
<option value="Wingdings">Wingdings</option>
</select><select name="leleFontSize" id="leleFontSize" class="leleMargin" onChange="FontSize(this.options[this.selectedIndex].value)">
<option value="">字号</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select>
</div>
<div class="leleIframe"><iframe id="leleEditor" frameborder="0" width="100%" height="167" marginheight="5" marginwidth="5" src="about:blank"></iframe></div>
</div>
<p>
<input name="content" type="hidden" id="content" />
</p>
<p>
<input type="submit" value="获取编辑器内容" onclick="return CheckForm();" />
</p>
</form>
</body>
</html>
.asp文件
<%
response.write request.Form("content")
%>
红色部份。。在IE下可以。。在FF浏览器下没有效果。。请问一般这问题是什么导致的。需要如何兼容FF浏览器?