Question

我正在使用tinymce HTML编辑器创建一个编辑器，该编辑器能够将HTML脚本存储到数据库中，然后从那里检索以创建博客帖子。出现的问题是，tinymce提供了一个名为＆＃34;的代码＆＃34;（用于查看书面内容的源代码（HTML）），其中包含一个语句

a.getContent(); //To get the source code

我想将此语句用作ajax查询以在后端发送查询字符串。但我不知道如何将这句话和ajax一起使用。这是Tinymce的代码插件（为了我的测试目的我已经改了一点）

tinymce.PluginManager.add("code",function(a){
function b(){var b=a.windowManager.open({
    title:"Source code",
    body:
    {
        type:"textbox",
        name:"code",multiline:!0,
        minWidth:a.getParam("code_dialog_width",600),
        minHeight:a.getParam("code_dialog_height",Math.min(tinymce.DOM.getViewPort().h-200,500)),
        spellcheck:!1,style:"direction: ltr; text-align: left"
    },
    onSubmit:function(b){
    a.focus(),
    a.undoManager.transact(function(){
    a.setContent(b.data.code)}),
    a.selection.setCursorLocation(),
    a.nodeChanged()
}});
console.log(a.getContent({source_view:0}))}
a.addCommand("mceCodeEditor",b),
a.addButton("code",{icon:"code",tooltip:"Source code",onclick:b}),
a.addMenuItem("code",{icon:"code",text:"Source code",context:"tools",onclick:b})});

我的网页包含此

<head>
<script src="jquery.1.12.2.min.js"></script>
<script type="text/javascript" src='tinymce.min.js'></script>
<script type="text/javascript">
 tinymce.init({
 selector: '#myTextarea',
 theme: 'modern',
 width: 600,
 height: 300,
 plugins:
  'code' });
</script>
</head>
 <body>
 <div id="myTextarea"></div>
 </body>
</html>

Answer 1

//your ajax call
$.ajax({
   type:'POST'
   data:$('#myTextarea').tinyMCE().getContent()
})

Answer 2

{ type: String, lowercase: true, trim: true, unique:true }将为您提供编辑器内的数据。

现在使用tinyMCE.get('myTextarea').getContent()将数据发送到服务器。

参见代码示例：

JS Bin链接：http://jsbin.com/giruro/edit?html,js,output

$.ajax justs警告数据，"SEE" button使用tinyce编辑器内容向服务器发送AJAX请求。

"SEND" button

$("#target1").click(function() {
  alert(tinyMCE.get('myTextarea').getContent());
});
$("#target2").click(function() {
  $.ajax({
      method: "POST",
      url: "foobar",
      data: {
        data: tinyMCE.get('myTextarea').getContent()
      }
    })
    .done(function(msg) {
      alert("Data Saved: " + msg);
    });
});

如何使用带有tinyMCE HTML编辑器的ajax来发送源代码

2 个答案: