TinyMCE menyerahkan AjaxForm dan gagal mendapatkan kemahiran penyelesaian_javascript data

Artikel ini menganalisis penyelesaian kepada masalah yang TinyMCE tidak dapat memperoleh data apabila menyerahkan AjaxForm. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

Sebelum menggunakan AjaxForm, saya membuat borang web kecil untuk penyerahan komen Kandungan ulasan telah diedit menggunakan TinyMCE. Untuk meningkatkan sedikit pengalaman pengguna, hanya gunakan AjaxForm untuk melaksanakan penyerahan Ajax. Tetapi sesuatu yang tidak dijangka berlaku. Iaitu, setiap kali anda menghantar, kali pertama anda menghantar, AjaxForm tidak akan dapat mendapatkan kandungan komen yang sedang diedit, iaitu kandungan dalam TextArea Anda perlu mengklik hantar semula untuk menghantar kandungan TextArea.

Kuncinya ialah kandungan pada TinyMCE tidak dikemas kini ke TextArea sebelum penyerahan. Jadi saya ingin melihat sama ada AjaxForm mempunyai pengikatan acara sebelum penyerahan saya mendapati bahawa dalam acara beforeSubmit, kandungan formData telah diisi. Walaupun saya boleh mengisi kandungan TinyMCE semasa di sini, saya sentiasa merasakan bahawa ia tidak. penyelesaian yang sangat cantik.

Untuk mengetahui sama ada terdapat cara lain untuk menyelesaikan masalah ini, saya menyemak kod sumber AjaxForm dan mendapati bahawa pengarang AjaxForm telah mencadangkan penyelesaian bersatu untuk masalah ini Kod sumber khusus adalah seperti berikut:

1. Kod js adalah seperti berikut:

Salin kod Kod adalah seperti berikut:

// cangkuk untuk memanipulasi data borang sebelum ia diekstrak;
// mudah digunakan dengan editor kaya seperti tinyMCE atau FCKEditor
varveto = {};
this.trigger('form-pre-serialize', [ini, pilihan, veto]);
jika (veto.veto) {
log('ajaxSubmit: serahkan disemak melalui pencetus pra-siri borang');
pulangkan ini;
}

2. Sama seperti FCKEditor:

Salin kod Kod adalah seperti berikut:

// ikat borang menggunakan 'ajaxForm'
$('#commentForm').ajaxForm(options);
// Ikat acara form-pre-serialize dan simpan data tinyMCE ke textarea sebelum mencetuskan acara form-serilaize
$('#commentForm').bind('form-pre-serialize', fungsi(acara, borang, pilihan, veto) {
tinyMCE.triggerSave();
});

Saya harap artikel ini akan membantu reka bentuk pengaturcaraan JavaScript semua orang.