`

xhEditor,读取textarea的value值,取不到最新编辑结果

阅读更多
在一个编辑框中,利用xhEditor,对立面的值进行修改,在前台利用javascript进行校验是,取到的都是修改前的值,而在提交之后,到后台得到的确实是修改之后的新值,这就造成了前端无法验证当前是否为空的问题。
在网上找了好多关于xhEditor的问题,加上几个同学不停地调试,最终解决了这个问题。
首先,xhEditor是一个基于JQuery开发的插件,只能利用JQuery来进行dom操作才行,另外,xhEditor默认会在textarea所在的form对象中绑定onsubmit事件,当用户点击submit按钮时,xhEditor就会将最新结果同步回textarea,随后随表单中的其它表单项一同提交到服务端脚本。因此,如果在onsubmit事件之前,用jquery来取值,是取不到最新编辑的值。
综上所述,要利用jquery来绑定form表单的submit事件,
进行绑定之前最终要的一点是,绑定代码必需在xhEditor初始化代码后面,也就是说在xhEditor把值回传后再读取,此后在相应绑定的函数中读取textarea的value值,才会是最新编辑结果,初始化代码一般是
$('#myTextarea').xheditor({tools:'full',skin:'default',showBlocktag:true,internalScript:false,internalStyle:false,width:300,height:200,loadCSS:'http://xheditor.com/test.css',fullscreen:true,sourceMode:true,forcePtag:true,upImgUrl:"upload.php",upImgExt:"jpg,jpeg,gif,png"});

或者为在程序中的
<textarea id="myTextarea" rows="50" cols="75" label="内容" name="content" Class="xheditor {skin:'o2007blue',html5Upload:false,upMultiple:'1',upImgUrl:'noDectestUpload.html',upImgExt:'jpg,jpeg,gif,bmp,png',upLinkUrl:'noDectestUpload.html',upLinkExt:'zip,rar,txt,docx,doc,xls,xlsx,pdf',tools:'simple'}">content</textarea>

即如下所示的绑定form的submit事件的代码,必须在上述的xhEditor初始化代码之后,在写:
<script type="text/javascript">
$(document).ready(function(){
  $("form").submit(function(e){
     $("myTextarea").val();
    alert("取值进行校验");
  });
});
</script>

分享到:
评论

相关推荐

    xheditor-1.1.14

    说明:通过本参数,在非标准submit提交环境下,比如AJAX提交,可以由用户点击提交按钮以触发编辑器最新值的同步 备注:v1.1.7新添加 onPaste:剪切板粘贴回调函数 参数值:用户粘贴后需要执行的函数 说明:此函数...

    xheditor 在线编辑器

    xheditor-1.1.4 在线编辑器 自己感觉很不错!

    xheditor文本编辑器

    Fckeditor太大,加载很慢。于是xheditor便开始出现在人们的视野里。可能你还不知道xheditor是什么,其实你...目前,创络科技正致力于整合优化后的xheditor到我们的后台系统,使客户可以更加容易、快速的编辑网站内容。

    xheditor-1.1.7 编辑器插件

    xheditor-1.1.7 编辑器插件 包含xheditor所含关键文件及jquery,导入web工程即可使用

    xhEditor编辑器

    例如:&lt;textarea name="content" class="xheditor"&gt;test&lt;/textarea&gt;经过以上步骤,你就已经成功的将xhEditor编辑器安装在你的网页中。若需要学习更多xhEditor编辑器的使用技术,请参阅:xhEditor进阶使用。

    HTML 在线编辑xheditor

    xheditor是.rar格式解压后就可以使用。附带例子,比较方便,尤其是JAVA爱好者

    xheditor文本编辑器插件制作html编辑器使用代码

    xheditor文本编辑器插件制作html编辑器使用代码 xheditor文本编辑器插件制作html编辑器使用代码

    xhEditor在线编辑器完整实例

    xhEditor在线编辑器完整实例,可直接运行

    xheditor 文本编辑器插件

    xheditor 文本编辑器插件.web开发 的文本编辑器。

    xheditor-1.1.1编辑器下载

    xheditor编辑器.................xheditor编辑器.................xheditor编辑器.................xheditor编辑器.................xheditor编辑器.................

    最新版本xheditor-v1.2.2

    最新版本xheditor-v1.2.2

    xheditor 编辑器

    xheditor 编辑器

    xheditor编辑器实现图片上传

    基于轻量级的JQuery的xheditor编辑器+jsp实现图上传功能

    xheditor在线编辑器 修改版

    1 .修改多处引用 每次都要手动的写入大量的JS ...上传的文件信息保存到数据库 且返回文件Id 及名称 4 .增加Google地图 插入图片 5 .上传附件及Google地图 为自定义的插件开发 使用 C# 语言的可以关注下

    xhEditor,简洁版php编辑器

    xhEditor是一个基于jQuery开发的简单迷你并且高效的在线可视化HTML编辑器,基于网络访问并且兼容IE 6.0+,Firefox 3.0+,Opera 9.6+,Chrome 1.0+,Safari 3.22+。

    xhEditor(可视化HTML编辑器) v1.2.1官方最新版.rar

    极大方便今后的开发,同时方便拓展海外市场添加:插件添加i参数,作为插件初始化函数,编辑器初始化时,同时会调用此函数添加:添加Markdown可视化编辑支持,请查看demo14添加:添加IOS6、Android最新浏览器、移动...

    xheditor 在线编辑器jsp/ava实现版

    xheditor是非常实用的web应用在线编辑器,本程序通过jsp/java实现,可上传图片、视频、远程抓图上传(如QQ截图后直接粘贴在编辑器后自动上传到服务器保存),非常方便、实用。

    xhEditor文本编辑器在asp.net中的应用

    xhEditor文本编辑器在asp.net中的应用

    很好用的ajax在线编辑器xheditor

    相当好用的ajax在线编辑器xheditor,欢迎大家下载。

    用于xheditor编辑器上传功能的配置文件

    用于xheditor编辑器上传功能的配置文件 upload.aspx,直接下载拷贝到项目根目录下即可。 里面的该行: string attachdir ="../upload"; 是上传路径,根据实际引用xheditor的页面位置,要进行相应的修改,要不然无法...

Global site tag (gtag.js) - Google Analytics