blocks|key|1135623|text|这是因为它不再是一个文本区。它被替换为iframe+(等等)，并且serialize函数只从表单域获取数据。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1135624|将隐藏字段添加到表单：|1135625|<input+type="hidden"+id="question_html"+name="question_html"+/>|code-block|syntax|javascript|1135626|在发布表单之前，从编辑器获取数据并将其放入隐藏字段：|1135627|$('#question_html').val(tinyMCE.get('question_text').getContent());|1135628|(如果您正常发布表单，编辑器当然会自己处理这件事，但由于您在不使用表单的情况下自己抓取表单并发送数据，所以表单上的onsubmit事件永远不会被触发。)|1135629|entityMap^0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|T|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

That's because it's not a textarea any longer. It's replaced with an iframe (and whatnot), and the serialize function only gets data from form fields.

Add a hidden field to the form:

<pre><code>&lt;input type="hidden" id="question_html" name="question_html" /&gt;
</code></pre>

Before posting the form, get the data from the editor and put in the hidden field:

<pre><code>$('#question_html').val(tinyMCE.get('question_text').getContent());
</code></pre>

(The editor would of course take care of this itself if you posted the form normally, but as you are scraping the form and sending the data yourself without using the form, the onsubmit event on the form is never triggered.)

blocks|key|1135656|text|你也可以简单地使用TinyMCE的jQuery插件和包，它可以解决这类问题。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1135657|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

You can also simply use the jQuery plugin and package for TinyMCE it sorts out these kinds of issues.

blocks|key|1350975|text|在提交表单之前，请调用tinyMCE.triggerSave();|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1350976|entityMap^0|B|M|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|K|8|@]|D|@]|E|$]]]|G|$]]

Before submitting the form, call <code>tinyMCE.triggerSave();</code>

blocks|key|1135686|text|我使用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1135687|var+save_and_add+=+function(){
++++tinyMCE.triggerSave();
++++$('.new_multi_text_block_item').submit();
};|code-block|syntax|javascript|1135688|这就是您需要做的全部工作。|1135689|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

I used:

<pre><code>var save_and_add = function(){
 tinyMCE.triggerSave();
 $('.new_multi_text_block_item').submit();
};
</code></pre>

This is all you need to do.

blocks|key|1351024|text|@eldar:在‘正常模式’下运行3.6.7时，我也遇到了同样的问题；triggerSave和save()都不起作用。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1351025|我改用了jQuery+TinyMCE插件，现在不用做任何其他事情，它就可以工作了。我假设他们在某处为jQuery版本的TinyMCE实现了某种自动triggerSave。|1351026|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

@eldar: I had the same issue with 3.6.7 running in 'normal mode'; and neither triggerSave or save() were working. 

I changed to the jQuery TinyMCE plugin and without having to do anything else it's working now. I'm assuming somewhere along the line they implemented some kind of auto triggerSave for the jQuery version of TinyMCE.

blocks|key|1135715|text|var+text+=+tinyMCE.activeEditor.getContent();
$('#textareaid').remove();
$('<textarea+id="textareaid"+name="textareaid">'%2Btext%2B'</textarea>').insertAfter($('[name=someinput]'));|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1135716|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>var text = tinyMCE.activeEditor.getContent();
$('#textareaid').remove();
$('&lt;textarea id="textareaid" name="textareaid"&gt;'+text+'&lt;/textarea&gt;').insertAfter($('[name=someinput]'));
</code></pre>

blocks|key|1135754|text|我只需隐藏()+tinymce并提交表单，修改后的textarea值就丢失了。因此，我添加了以下内容：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1135755|$("textarea[id='id_answer']").change(function(){
++++var+editor_id+=+$(this).attr('id');
++++var+editor+=+tinymce.get(editor_id);
++++editor.setContent($(this).val()).save();
});|code-block|syntax|javascript|1135756|这对我很管用。|1135757|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|L|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|M|8|@]|9|@]|A|$]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

I just hide() the tinymce and submit form, the changed value of textarea missing. So I added this:

<pre><code>$("textarea[id='id_answer']").change(function(){
 var editor_id = $(this).attr('id');
 var editor = tinymce.get(editor_id);
 editor.setContent($(this).val()).save();
});
</code></pre>

It works for me.

blocks|key|1135797|text|您可以按如下方式配置TinyMCE，以便在通过TinyMCE编辑器进行更改时保持隐藏文本rea值的同步：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1135798|tinymce.init({
++++selector:+"textarea",
++++setup:+function+(editor)+{
++++++++editor.on('change',+function+()+{
++++++++++++editor.save();
++++++++});
++++}
});|code-block|syntax|javascript|1135799|textarea元素将自动保持最新，在序列化表单等之前不需要任何额外的步骤。|1135800|这已经在TinyMCE+4.0上进行了测试|1135801|演示运行于：http://jsfiddle.net/9euk9/49/|offset|length|1135802|更新:上面的代码已经根据DOOManiac的评论进行了更新|1135803|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/9euk9/49/^0|0|0|0|0|6|T|0|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|Z|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|10|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|11|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|12|8|@]|9|@$M|13|N|14|1|15]]|A|$]]|$1|O|3|P|5|6|7|16|8|@]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|17|8|@]|9|@]|A|$]]]|R|$S|$5|T|U|V|A|$W|X]]]]

You can configure TinyMCE as follows to keep the values of hidden textareas in sync as changes are made via TinyMCE editors:

<pre><code>tinymce.init({
 selector: "textarea",
 setup: function (editor) {
 editor.on('change', function () {
 editor.save();
 });
 }
});
</code></pre>

The textarea elements will be kept up to date automatically and you won't need any extra steps before serializing forms etc.

This has been tested on TinyMCE 4.0 

Demo running at: <a href="http://jsfiddle.net/9euk9/49/">http://jsfiddle.net/9euk9/49/</a>

Update: The code above has been updated based on DOOManiac's comment

blocks|key|1351146|text|我遇到这个问题有一段时间了，triggerSave()不起作用，其他任何方法也不起作用。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1351147|所以我找到了一种对我有效的方法(我在这里添加这一点，因为其他人可能已经尝试过triggerSave等……)：|1351148|tinyMCE.init({
+++selector:+'.tinymce',+//+This+is+my+<textarea>+class
+++setup+:+function(ed)+{
++++++++++++++++++ed.on('change',+function(e)+{
+++++++++++++++++++++//+This+will+print+out+all+your+content+in+the+tinyMce+box
+++++++++++++++++++++console.log('the+content+'%2Bed.getContent());
+++++++++++++++++++++//+Your+text+from+the+tinyMce+box+will+now+be+passed+to+your++text+area+...+
+++++++++++++++++++++$(".tinymce").text(ed.getContent());+
++++++++++++++++++});
++++++++++++}
+++...+Your+other+tinyMce+settings+...
});|code-block|syntax|javascript|1351149|当您提交表单或其他任何东西时，您所要做的就是使用$('.tinymce').text()从选择器(在我的例子中是：.tinymce+)获取数据。|1351150|entityMap^0|E|D|0|0|0|O|K|1L|8|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|T|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|U|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|V|8|@$9|W|A|X|B|C]|$9|Y|A|Z|B|C]]|D|@]|E|$]]|$1|O|3|-4|5|6|7|10|8|@]|D|@]|E|$]]]|P|$]]

I had this problem for a while and <code>triggerSave()</code> didn't work, nor did any of the other methods. 

So I found a way that worked for me ( I'm adding this here because other people may have already tried triggerSave and etc... ):

<pre><code>tinyMCE.init({
 selector: '.tinymce', // This is my &lt;textarea&gt; class
 setup : function(ed) {
 ed.on('change', function(e) {
 // This will print out all your content in the tinyMce box
 console.log('the content '+ed.getContent());
 // Your text from the tinyMce box will now be passed to your text area ... 
 $(".tinymce").text(ed.getContent()); 
 });
 }
 ... Your other tinyMce settings ...
});
</code></pre>

When you're submitting your form or whatever all you have to do is grab the data from your selector ( In my case: <code>.tinymce</code> ) using <code>$('.tinymce').text()</code>.

blocks|key|1351177|text|在表单上运行ajax时，需要告诉TinyMCE首先更新文本区：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1351178|//+TinyMCE+will+now+save+the+data+into+textarea
tinyMCE.triggerSave();+
//+now+grap+the+data
var+form_data+=+form.serialize();+|code-block|syntax|javascript|1351179|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

When you run ajax on your form, you need to tell TinyMCE to update your textarea first:

<pre class="lang-js prettyprint-override"><code>// TinyMCE will now save the data into textarea
tinyMCE.triggerSave(); 
// now grap the data
var form_data = form.serialize(); 
</code></pre>

blocks|key|1351229|text|这将确保在失去文本区域的焦点时保存内容|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1351230|+setup:+function+(editor)+{
++++++++++++++++editor.on('change',+function+()+{
++++++++++++++++++++tinymce.triggerSave();
++++++++++++++++});|code-block|syntax|javascript|1351231|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

This will ensure that the content gets save when you lose focus of the textarea 

<pre><code> setup: function (editor) {
 editor.on('change', function () {
 tinymce.triggerSave();
 });
</code></pre>

I am using <a href="http://en.wikipedia.org/wiki/JQuery" rel="noreferrer">jQuery</a> and <a href="http://en.wikipedia.org/wiki/TinyMCE" rel="noreferrer">TinyMCE</a> to submit a form, but there is a problem in serialization in that the Textarea value doesn't post.

Here is the code:

<pre><code>&lt;form id="myForm" method="post" action="post.php"&gt;
 &lt;textarea name="question_text" id="question_text" style="width:543px;height:250px;"&gt;&lt;/textarea&gt;
&lt;/form&gt;
</code></pre>

language: lang-js

<pre><code>$('#myForm').submit(function() {
 $.ajax({
 type: 'POST',
 url: $(this).attr('action'),
 data: $(this).serialize(),
 success: function(data) {
 $('#result').fadeIn('slow');
 $('#result').html(data);
 $('.loading').hide();
 }
 })
 return false;
});

tinyMCE.init({
 // General options
 mode : "textareas",
 theme : "advanced",

 // Theme options
 theme_advanced_buttons1 : "bold,italic,underline,separator,image,separator,justifyleft,justifycenter,justifyright,jformatselect,fontselect,fontsizeselect,justifyfull,bullist,numlist,undo,redo,styleprops,cite,link,unlink,media,advhr,code,preview",
 theme_advanced_buttons2 : "",
 theme_advanced_toolbar_location : "top",
 theme_advanced_toolbar_align : "left",
 theme_advanced_statusbar_location : "bottom",
 theme_advanced_resize_horizontal : false,
 theme_advanced_resizing : true,
 extended_valid_elements :"a[name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]",
});
</code></pre>

Can you explain to me what I should change, and why, in order to get the value in the text area posted?

jQuery and TinyMCE: textarea value doesn't submit

我正在使用和提交表单，但是序列化中有一个问题，因为Textarea值不能post。代码如下：<form id="myForm" method="post" action="post.php"> <textarea name="question_text" id="question_text" style="wid...

问jQuery和TinyMCE:文本区值不提交
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery和TinyMCE:文本区值不提交EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jQuery和TinyMCE:文本区值不提交
EN