这篇文章主要介绍了tinymce提交ajaxform获取不到数据的解决方法,实例分析了对应的源码部分与相应的解决方法,具有一定参考借鉴价值,需要的朋友可以参考下
! ?! l' _0 [7 @; S# L7 E本文实例分析了tinymce提交ajaxform获取不到数据的解决方法。分享给大家供大家参考。具体分析如下:
/ ^! W6 p& ~) X( z4 s t在没有使用ajaxform前,我做的一个小小的评论提交的web form,评论内容使用了tinymce做文本编辑。为了增加一点点的用户体验,就顺手拿ajaxform来实现ajax提交。可是发现出现了一个意外的事情。就是每次提交,第一次提交时,ajaxform会无法获得当前编辑的评论内容,即textarea里面的内容,要再点击一次提交,才能将textarea的内容提交上去。
% ?6 g. p2 H4 }$ y' R# }关键是tinymce上的内容没有在提交前更新到textarea中。于是想看看ajaxform是否有在提交前的事件绑定,发现在beforesubmit事件中,formdata的内容已经被填充,虽然可以在此处自行将当前的tinymce的内容填充上去,可是总觉得是不太漂亮的解决方案。
1 O1 `: `+ g, [( Q3 M e为了找是否有其它途径解决此问题,我查看了一下ajaxform的源代码,发现原来ajaxform作者已经为这问题提出了统一的解决方案,具体源代码如下:
9 {* P: }5 j5 E( ]2 [ @1. js代码如下:
9 t/ i0 s4 q- r7 Y- f代码如下:
5 J, f& O/ q8 B3 ~// hook for manipulating the form data before it is extracted;
) \& ]" |" T+ |. r) H// convenient for use with rich editors like tinymce or fckeditor0 a( u2 s/ v4 T
var veto = {}; H9 k, g; H1 W1 Z! c. E: X
this.trigger('form-pre-serialize', [this, options, veto]);2 A% n: Q; |; O* \; @0 p: Q
if (veto.veto) {
, ~* U3 B. j6 Slog('ajaxsubmit: submit vetoed via form-pre-serialize trigger');
. _" I7 J% e9 W/ w/ `3 u$ xreturn this;" G! [6 G$ z! G4 S1 d- Q9 W& U
}' I- M n% _1 U
2. 对应fckeditor类似:
6 Q5 N! ^% x# x; [0 r1 [3 \代码如下:
4 [1 n8 ]% @8 o// bind form using 'ajaxform'
0 J. `, \" [8 m5 t$('#commentform').ajaxform(options);% D' f" {, m7 N8 ^1 A0 ~2 c8 K7 @
// 绑定form-pre-serialize事件,在触发form-serilaize事件前保存tinymce的数据到textarea中
% x% | Y9 f" E3 N' J& `$('#commentform').bind('form-pre-serialize', function(event, form, options, veto) {
3 \. p! `! B- \; z2 rtinymce.triggersave();6 X! g8 T3 B* a! z
}); V+ X' j4 Y3 W
希望本文所述对大家的javascript程序设计有所帮助。+ n5 Y9 O9 I; w% q9 w
/ \2 p3 E) U, o0 P; a o
更多网页制作信息请查看: 网页制作 |
|