使用jQuery在TinyMCE编辑器中设置值

时间:2011-12-20 13:17:28

标签: javascript jquery tinymce textarea

您好我需要在tinyMCE编辑器中设置预定义内容。下面是我的html和jquery。

<script type="text/javascript">
    tinyMCE.init( {
        mode : "exact" ,
        elements : "country"
    });
</script>
<script type="text/javascript">
    $(function() {
        $("#lang").change(function() {
            var s = $(this).val(); alert(s);
            $("#country").val(s);
        })
    })
</script>


<select id="lang">
        <option value="">Please Select country</option>
        <option value="us">US</option>
        <option value="es">SPAIN</option>
        <option value="jp">JAPAN</option>
    </select><br /><br />
    <textarea id="country" cols="10" rows="5"></textarea>

该脚本适用于普通的textarea,但不适用于tinyMCE。我有什么问题吗?

由于

5 个答案:

答案 0 :(得分:34)

我认为你可以做到:

$(function() {
    $("#lang").change(function() {
        var s = $(this).val(); 
        alert(s);
        tinyMCE.activeEditor.setContent(s);
    });
});

答案 1 :(得分:11)

对我来说,只有代码有效:

tinyMCE.get('my_textarea_id').setContent(my_value_to_set);

也许这是新版本tinyMCE的代码! (Tiny MCE Api 3)

答案 2 :(得分:2)

这对我有用

  

$( “#描述”)VAL(内容);

答案 3 :(得分:1)

您也可以尝试以下方法:
如果没有在tinymce内替换整个内容,则将光标设置在要在tinymce内添加值的位置

$(document).on('change','#lang', function() {
     var Getname = $(this).val();
     if (Getname != '') {
        //tinyMCE.activeEditor.setContent(s);   // This is for replace all content
        tinyMCE.activeEditor.execCommand('mceInsertContent',false,Getname); // Append new value where your Cursor
        //console.log(Getname)
    }
 });

我正在使用这段代码 TinyMCE 5

的新版本

答案 4 :(得分:0)

ajax调用前需要调用触发器

tinyMCE.trigge*emphasized text*rSave(true, true);

完整语法

  tinyMCE.triggerSave(true, true);
        $.ajax({
          data: $('#userForm').serialize(),

          url: "{{ route('versions.store') }}",
          type: "POST",
          dataType: 'json',
          success: function (data) {
          }
          });