用javascript取控件的值本来是一件简单的事却被eWebEditor搞的很不方便，导致很多初学者，不知道该如何获取。在分析之前先把我们习惯性的取值方法写出来。
view plaincopy to clipboardprint?
<HTML>
<HEAD>
<TITLE>eWebEditor ： 标准调用示例</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<link rel='stylesheet' type='text/css' href='example.css'>
<script>
function validateForm(){
if(document.getElementById("content1").value!=""){
document.getElementById("myform").submit();
}else{
alert("空");
}
}
</script>
</HEAD>
<BODY>
<FORM method="post" name="myform" action="rs.jsp">
<TABLE border="0" cellpadding="2" cellspacing="1">
<TR>
<TD>编辑内容：</TD>
<TD>
<INPUT type="hidden" name="content1" >
<IFRAME ID="eWebEditor1" src="../ewebeditor.htm?id=content1&style=coolblue" frameborder="0" scrolling="no" width="550" height="350"></IFRAME>
</TD>
</TR>
<TR>
<TD colspan=2 align=right>
<INPUT type=button value="提交" onclick="validateForm()">
<INPUT type=reset value="重填">
<INPUT type=button value="查看源文件" onclick="location.replace('view-source:'+location)">
</TD>
</TR>
</TABLE>
</FORM>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>eWebEditor ： 标准调用示例</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<link rel='stylesheet' type='text/css' href='example.css'>
<script>
function validateForm(){
if(document.getElementById("content1").value!=""){
document.getElementById("myform").submit();
}else{
alert("空");
}
}
</script>
</HEAD>
<BODY>
<FORM method="post" name="myform" action="rs.jsp">
<TABLE border="0" cellpadding="2" cellspacing="1">
<TR>
<TD>编辑内容：</TD>
<TD>
<INPUT type="hidden" name="content1" >
<IFRAME ID="eWebEditor1" src="../ewebeditor.htm?id=content1&style=coolblue" frameborder="0" scrolling="no" width="550" height="350"></IFRAME>
</TD>
</TR>
<TR>
<TD colspan=2 align=right>
<INPUT type=button value="提交" onclick="validateForm()">
<INPUT type=reset value="重填">
<INPUT type=button value="查看源文件" onclick="location.replace('view-source:'+location)">
</TD>
</TR>
</TABLE>
</FORM>
</BODY>
</HTML>
上面代码非常简单我们一般会认为document.getElementById("content1").value这样就可以取值了，但事实上并不是这样，通过这种方式取值，只能取到初始值，当编辑器的内容变化时是取不到的，为什么呢？为什么后台程序可以取得到编辑器中的值呢，<%=request.getParameter("content1")%>这里是可以取到编辑器中的内容的，但是document.getElementById("content1").value确不可以。看来eWebEditor在js中动了手脚，一定是动态帮定了提交事件，或动态绑定了在源码中搜索onsubmit找到如下代码，原来动态的绑定了onsubmit事件，这样每次在提交前会执行AttachSubmit函数
view plaincopy to clipboardprint?
oForm.attachEvent("onsubmit", AttachSubmit) ;
if (! oForm.submitEditor) oForm.submitEditor = new Array() ;
oForm.submitEditor[oForm.submitEditor.length] = AttachSubmit ;
if (! oForm.originalSubmit) {
oForm.originalSubmit = oForm.submit ;
oForm.submit = function() {
if (this.submitEditor) {
for (var i = 0 ; i < this.submitEditor.length ; i++) {
this.submitEditor[i]() ;
}
}
this.originalSubmit() ;
}
}
oForm.attachEvent("onsubmit", AttachSubmit) ;
if (! oForm.submitEditor) oForm.submitEditor = new Array() ;
oForm.submitEditor[oForm.submitEditor.length] = AttachSubmit ;
if (! oForm.originalSubmit) {
oForm.originalSubmit = oForm.submit ;
oForm.submit = function() {
if (this.submitEditor) {
for (var i = 0 ; i < this.submitEditor.length ; i++) {
this.submitEditor[i]() ;
}
}
this.originalSubmit() ;
}
}view plaincopy to clipboardprint?
function AttachSubmit() {
var oForm = oLinkField.form ;
if (!oForm) {return;}
var html = getHTML();
ContentEdit.value = html;
if (sCurrMode=="TEXT"){
html = HTMLEncode(html);
}
splitTextField(oLinkField, html);
}
function AttachSubmit() {
var oForm = oLinkField.form ;
if (!oForm) {return;}
var html = getHTML();
ContentEdit.value = html;
if (sCurrMode=="TEXT"){
html = HTMLEncode(html);
}
splitTextField(oLinkField, html);
}
AttachSubmit就是copy编辑器的内容到隐藏域控件中的过程。
知道了过程我们的问题就不难解决了。只需在取编辑器内容之前执行下AttachSubmit即可
view plaincopy to clipboardprint?
function validateForm(){
window.frames["eWebEditor1"].AttachSubmit();//执行iframe页面中的AttachSubmit函数
if(document.getElementById("content1").value!=""){
document.getElementById("myform").submit();
}else{
alert("空");
}
}
function validateForm(){
window.frames["eWebEditor1"].AttachSubmit();//执行iframe页面中的AttachSubmit函数
if(document.getElementById("content1").value!=""){
document.getElementById("myform").submit();
}else{
alert("空");
}
} 整个过程就此结束，其实eWebEditor代码中的很多思想都是很具有参考价值的例如AttachSubmit的绑定submit 方法的重新封装，我还发现一段比较写的比较好的代码也一起贴出来。
view plaincopy to clipboardprint?
var URLParams = new Object() ;
var aParams = document.location.search.substr(1).split('&') ;
for (i=0 ; i < aParams.length ; i++) {
var aParam = aParams[i].split('=') ;
URLParams[aParam[0]] = aParam[1] ;
}
var sLinkFieldName = URLParams["id"] ;
var sExtCSS = URLParams["extcss"] ;
var sFullScreen = URLParams["fullscreen"];
var config = new Object() ;
config.StyleName = (URLParams["style"]) ? URLParams["style"].toLowerCase() : "coolblue";
config.CusDir = URLParams["cusdir"];
config.ServerExt = "jsp";
var URLParams = new Object() ;
var aParams = document.location.search.substr(1).split('&') ;
for (i=0 ; i < aParams.length ; i++) {
var aParam = aParams[i].split('=') ;
URLParams[aParam[0]] = aParam[1] ;
}
var sLinkFieldName = URLParams["id"] ;
var sExtCSS = URLParams["extcss"] ;
var sFullScreen = URLParams["fullscreen"];
var config = new Object() ;
config.StyleName = (URLParams["style"]) ? URLParams["style"].toLowerCase() : "coolblue";
config.CusDir = URLParams["cusdir"];
config.ServerExt = "jsp";
解析url的方法，这种方法以前koko跟我说过一回，今天在ewebeditor中又看到了，看来是一种比较常规的分析URL参数的方法。
总结：其实eWebEditor只是修改了提交表单的两个事件，在提交表单前进行值copy，从而避免了编辑器每次更新都同步值这种没有必要的操作。
原文网址：http://blog.csdn.net/sunyujia/archive/2008/06/21/2572861.aspx
分享到：
相关推荐
### eWebEditor编辑器在IE7、IE8、IE9下的兼容性问题及解决方案 #### 一、问题背景 在使用eWebEditor编辑器的过程中，可能会遇到在IE7、IE8、IE9浏览器环境下某些功能按钮无法正常工作的情况。这主要是由于这些...
eWebEditor是一款功能强大的在线HTML编辑器，专为网页内容编辑设计。它允许用户通过浏览器进行文本编辑，如同使用桌面版的Word一样方便，极大地提高了网站内容创作的效率。这款编辑器支持多种富文本格式，如字体、...
**ewebeditor商业版编辑器**是一款广泛应用于网站后台程序的富文本编辑器，它为网站管理员和内容创作者提供了一种高效、便捷的方式来创建、编辑和格式化网页内容。这款编辑器以其强大的功能和易用性，深受开发者的...
eWebEditor是一款基于JavaScript的富文本编辑器，它提供了一个类似于Microsoft Word的用户界面，让用户可以直接在网页上进行文字编辑、格式调整、图片插入等操作。它的设计目标是简化网站内容的维护和更新，使非技术...
然后在ASP页面中引入eWebEditor的JavaScript库，设置必要的配置参数，即可在网页上实现编辑器的功能。 **四、安全与优化** 尽管eWebEditor提供了许多便利，但也需要注意安全性问题。例如，需要防止XSS攻击，合理...
**eWebEditor在线文本编辑器**是一款专为网页设计和内容管理系统开发的富文本编辑工具。它允许用户在浏览器环境中进行类似Word的文本编辑操作，极大地提升了网站内容创作的便捷性和用户体验。eWebEditor支持多种格式...
本人因为用JSP的ewebeditor编辑器吃了不少苦头,所以把这个已经成功的包发布出来给有相同烦恼的朋友. ewebeditor编辑器分别在xp和linux下测试成功 有问题可以EMAIL给我 关于编辑无法显示： ...
解决eWebEditor编辑器按钮失效，IE8下eWebEditor编辑器无法使用问题解决方法。
ewebeditor是一款常见的在线富文本编辑器，它为用户提供了在网页上创建、编辑和发布文本内容的便捷工具。在默认情况下，ewebeditor支持基本的文本格式化、图片上传等功能，但为了满足更丰富的多媒体需求，比如插入...
好用的EWEBEDITOR编辑器 支持图片上传 很好用 专心修改版 但是仅用于ie 火狐下不支持 如需要的话可以用fck兼容性很好 我也有序改版的 联系我 qq 451082729 让我们在学习中进步
下载后，开发者需要将编辑器的文件夹上传至服务器，并在网页中通过JavaScript引用编辑器的JS文件，然后通过初始化配置来设置编辑器的属性和行为。 ### 4. 自定义配置 ewebeditor允许开发者根据项目需求进行自定义...
eWebEditor是一款基于JavaScript的富文本编辑器，允许用户在网页上进行类似Word的文本编辑操作，如插入文字、图片、链接等。它通过在浏览器端运行，提供了一种简单、便捷的方式来创建和编辑HTML内容，常用于论坛、...
在线编辑器JSP版eWebEditor是一款专为Java Web开发者设计的文本编辑组件，它允许用户在网页上直接进行文本编辑、格式化和内容创作，类似于常见的富文本编辑器（例如TinyMCE和CKEditor）。这款编辑器以其便捷性和灵活...
对于JSP开发者来说，eWebEditor提供了便捷的API接口，能够方便地将编辑器集成到JSP页面中，极大地提升了用户在网页上的内容创作体验。 二、核心功能 1. **富文本编辑**：支持字体、字号、颜色、对齐方式、列表、...
eWebEditor 编辑器 V10.9 破解后的eWebEditorServer.dll
FCKeditor、TinyMCE和eWebEditor都是著名的开源富文本编辑器，广泛应用于网站后台、论坛、CMS（内容管理系统）等。下面将详细讨论这些编辑器以及它们的精简版。 首先，FCKeditor是一款JavaScript实现的开源HTML编辑...
ewebeditor是一款广泛应用于网页内容编辑的富文本编辑器，尤其在网站后台管理系统中，它提供了便捷的HTML编辑功能，使得非程序员也能轻松地创建和编辑网页内容。作为一款开源的JavaScript组件，ewebeditor不仅支持...
最近为eWebEditor编辑器兼容烦，网上搜索到"eWebEditor7.0破解版"，测试了一下，发现还是有缺陷，抽时间做了修正，顺便把ASP、JSP版和PHP版也完善了。 希望对有同样烦恼的朋友有帮助。 1.修正已经上传的文件浏览...
**eWebEditor：一款强大的JSP编辑器** eWebEditor是一款功能丰富的在线文本编辑器，专为Java（JSP）平台设计。它以其对Word文档的支持和源代码编辑能力而备受青睐。在网页开发和内容管理系统中，eWebEditor扮演着...