标签: tinymce

Firefox上的JavaScript TinyMCE/jQuery竞争条件

我有一个网站,其表格使用TinyMCE; 独立地,我使用jQuery.当我从Firefox 3(MacOS X,Linux)上的登台服务器加载表单时,TinyMCE无法完成加载.Firefox控制台出错,说t.getBody()返回了null. t.getBody()据我所知,从TinyMCE docs,是一个函数返回文档的body元素,以检查某些功能.使用Safari时不会出现问题,也不会在使用从localhost运行的同一站点的Firefox时出现问题.

原始的,失败的JavaScript相关代码如下所示:

<script type="text/javascript" src="http://static.alfa.foo.pl/json2.js"></script>
<script type="text/javascript" src="http://static.alfa.foo.pl/jquery.js"></script>
<script type="text/javascript" src="http://static.alfa.foo.pl/jquery.ui.js"></script>
<script type="text/javascript" src="http://static.alfa.foo.pl/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
  tinyMCE.init({ mode:"specific_textareas", editor_selector:"mce", theme:"simple", language:"pl" });
</script>
<script type="text/javascript" src="http://static.alfa.foo.pl/jquery.jeditable.js"></script>
<script type="text/javascript" src="http://static.alfa.foo.pl/jquery.tinymce.js"></script>
<script type="text/javascript" charset="utf-8" src="http://static.alfa.foo.pl/foo.js"></script>
<script type="text/javascript">
  $(document).ready(function(){
    /* jQuery initialization */ });
</script>
Run Code Online (Sandbox Code Playgroud)

我尝试更改脚本加载顺序,移动 tinyMCE.init() call to the <script/> tag containing $(document).ready() call—before, after, and inside this call. No result. When tinyMCE.init() was called from within $(document).ready() handler, the browser did …

javascript firefox jquery tinymce

7
推荐指数
1
解决办法
1万
查看次数

微小的MCE - 在加载编辑器时设置全屏?

我在iframe中的textareas中使用tiny_mce作为类似于字的编辑器.我想使用整个iframe空间.TinyMCE有一个全屏按钮,但我需要在插件加载时自动设置全屏模式.是否有功能/触发器来调用此模式(或按钮)?感谢帮助.

javascript iframe tinymce

7
推荐指数
1
解决办法
6240
查看次数

TinyMCE安全问题:您如何防止恶意输入?

如何防止像TinyMCE这样所见即所得的编辑器中的恶意输入?

我有一个系统,用户不是"精通技术"(因此没有WMD),需要一个富文本编辑器将其内容发布到数据库中.

我担心脚本攻击和恶意输入代码.

javascript php security codeigniter tinymce

7
推荐指数
1
解决办法
4970
查看次数

使用Drupal的WYSIWYG模块自定义TinyMCE

我想在TinyMCE工具栏上创建一个自定义按钮,用于将当前选定的内容包装在带有类的div中.我使用drysal 6.19与wysiwyg-dev和TinyMCE 3.3.9.2.

示范文本:

<h3>Heading</h3>
<p>Sample text</p>
<ul>
   <li>item 1</li>
   <li>item 2</li>
</ul>
<p>more text</p>
Run Code Online (Sandbox Code Playgroud)

已突出显示并按下"按钮"的示例文本:

<div class="note">
   <h3>Heading</h3>
   <p>Sample text</p>
   <ul>
      <li>item 1</li>
      <li>item 2</li>
   </ul>
   <p>more text</p>
</div>
Run Code Online (Sandbox Code Playgroud)

我已经阅读了互联网上的一些论坛,并找到了接近解决这个问题的人.有些人使用自定义的TinyMCE插件,就像这个人http://forum.cmsmadesimple.org/index.php?topic=44093.0

有人说新的TinyMCE版本3.3现在能够通过初始化TinyMCE时的'formats'变量来实现这一点 - http://tinymce.moxiecode.com/punbb/viewtopic.php?pid=73468

我的问题是 - 使用drupal实现这一目标的最佳方法是什么?我还没有完成上述任何工作

UPDATE

现在已经解决了这个问题,Jeremy就在下面,我知道他的回答在技术上是正确的答案,我主要是在询问是否有其他人对此做了类似的工作,并且已经创建了一个模块等.

无论如何,万一其他人遇到这个问题,这里是文件:

如果您发现这些文件有用,请告诉我们;)

谢谢肖恩

wysiwyg drupal tinymce drupal-6

7
推荐指数
1
解决办法
3101
查看次数

Wordpress - 在编辑器中插入html/text

我正在为Wordpress制作一个Vimeo上传插件,这样你就可以直接从wordpress上传到Vimeo并直接嵌入它.无论如何,我认为我有最难完成的部分,那就是身份验证(那里的坏例子).

现在我有另一个问题.在Wordpress中,您可以通过按下弹出窗口中的按钮将图像嵌入到富文本编辑器中.(http://cl.ly/6Xns)(荷兰语中'Invoegen in bericht'按钮).

现在我想做同样的事情,当有人点击我的'invoegen'按钮(http://cl.ly/6Wmn)时,将'some tekst'(一个网址就足够了)插入到富文本区域中我该如何实现这一点?

我在Wordpress网站上找不到任何javascript文档.希望有人可以提供帮助.我想,让我们看看其他按钮是如何做到的,但是检查员没有在该按钮上显示任何"onclicks"等.那些被迷上了,我不知道代码在哪里寻找.

希望有人可以帮助我.

亲切的问候.

javascript api wordpress tinymce

7
推荐指数
1
解决办法
4247
查看次数

最好的基于网络的HTML编辑器,如ckeditor,niceedit,tinymce?

我正在为我的网站后端寻找一个基于网络的HTML编辑器.我缩小到3 - Nicedit(好,但不再保持),tinymce和ckeditor.

虽然我将使用tinymce或ckeditor,但我也在寻找一个插件来管理我可以插入HTML区域的媒体(图片,视频等).当然还有CKFinder和MCFilemanager,但它们不是开源的.

我想知道是否有任何开源插件?此外,如果基于Web的开源文本编辑器有更好的选择,请建议.

谢谢

open-source tinymce text-editor ckeditor

7
推荐指数
1
解决办法
5739
查看次数

Tinymce html5占位符通过从textarea读取属性

对于标准textareas,我使用此插件来创建占位符.我怎样才能扩展tinymce以便以这种方式工作.

例如,从textarea属性读取默认值,然后在用户关注iframe时清除.

与CKEditor类似:http://alfonsoml.blogspot.com.es/2012/04/placeholder-text-in-ckeditor.html

jquery tinymce

7
推荐指数
2
解决办法
1万
查看次数

TinyMCE添加切换样式

我正在研究一个TinyMCE插件,我想要它做的一件事是注册命令/按钮切换自定义格式.

例如,如果单击TinyMCE中的粗体按钮,它将以粗体文本显示突出显示的粗体按钮.深入研究源代码我看到这种情况发生在:tinymce.EditorCommands.addCommands认为我似乎无法弄清楚如何复制它.TinyMCE的文档也很糟糕=(

所以给定customFormat我希望能够通过我的插件设置一个按钮,当应用customFormat时,它会像工具栏上的Bold,Italics和其他类似按钮一样显示.点击我的customFormat切换格式开/关.我可以通过"addCommand"和"addButton"轻松完成toogle,但是它没有像Bold那样的状态跟踪.

显示我当前的非工作尝试(此代码位于我的插件创建方法的init中):

tinymce.EditorCommands.call('addCommands', {
   'MyFormat' :  function(name) {
      ed.formatter.toggle("customFormat");
    }
},'exec');

tinymce.EditorCommands.call('addCommands', {
   'MyFormat' : function(name) {
       return ed.formatter.match('customFormat');
    } 
},'state');

ed.addButton('customformat', {cmd : 'MyFormat'});
Run Code Online (Sandbox Code Playgroud)

以下是addCommands"文档"的链接:http://www.tinymce.com/wiki.php/API3:method.tinymce.EditorCommands.addCommands

经过更多的环顾四周后,我发现这似乎是完美的:http://www.tinymce.com/wiki.php/API3: method.tinymce.Editor.addQueryStateHandler

但是当我实现代码时,它不会改变按钮的状态:

  ed.addCommand('MyFormat', function(ui, v) {
    ed.formatter.toggle("thoughtFormat");
  });

  ed.addQueryStateHandler('MyFormat', function() { 
      return ed.formatter.match('thoughtFormat');
  });

  ed.addButton('myformat', {cmd : 'MyFormat'});
Run Code Online (Sandbox Code Playgroud)

javascript tinymce

7
推荐指数
2
解决办法
5765
查看次数

使用带有wysiwyg markdown的jade允许用户编辑内容

我相信除非你绝对必须,否则不要重新发明轮子.所以我不想开始编写已经编码过的东西,或者很多人已经为此做出了贡献.

我刚刚移居到了行星Node.js(对不起php/apache),需要将资源放在一起,以便与其他语言一起使用.

我使用Node.js作为服务器监听器,Express.js作为中间件,jade js作为模板引擎.

我想使用类似TinyMCE的功能,但代码不是通常丑陋的HTML markup,我希望代码是markdown允许jade做它的majic.我想它或多或少像stackoverflow编辑(我正在输入),但也许更高级的UI明智.

因此,例如,如果我单击一个按钮,B它应该使所选文本变为粗体,就像使用所有WYSIWYG编辑器一样.

参考文献:

wysiwyg tinymce node.js express pug

7
推荐指数
1
解决办法
3875
查看次数

用内容初始化tinymce

我有一个包含一个tinymce4编辑器实例的页面.我想用编程方式用一些内容初始化这个编辑器.我知道我必须打电话:tinymce.get('editor').setContent('my content');

但是,当tinymce初始化时,我很难做到这一点.这个问题已经被提出:用默认内容初始化tinyMCE,但当时给出的答案不起作用,至少对于tinymce4.

这是我尝试过的:

第一次尝试:

    tinymce.init({
      mode: "textareas",
      ...
      setup: function (editor) {
         ...
         editor.setContent('my content');
      }
   });
Run Code Online (Sandbox Code Playgroud)

- >未捕获的TypeError:无法读取未定义的属性"body"

第二次尝试:

    tinymce.init({
      mode: "textareas",
      ...
    };
    tinymce.get('editor').setContent('my content');
Run Code Online (Sandbox Code Playgroud)

- > Uncaught TypeError:无法读取null的属性'setContent'(但是如果我在加载了包含tinymce编辑器的页面时执行此操作,则可以正常工作).

第3次尝试(SO 12083361答案):

$(document).ready(function(){
    tinymce.get('editor').setContent('my content');
});
Run Code Online (Sandbox Code Playgroud)

- > Uncaught TypeError:无法读取null的属性'setContent'

所有这一切都失败了tinymce.activeeditor.setContent('my content');.

我应该tinymce.get('editor').setContent('my content');在哪里放置代码才能使其正常工作?

javascript tinymce tinymce-4

7
推荐指数
1
解决办法
2万
查看次数