标签: tinymce

无法使用 Symfony2 和 TinyMCE 提交表单

我有一个带有由 TinyMCE Javascript 库丰富的文本区域的表单。当启用 Javascript 库时,如果我按下提交按钮,页面不会改变!如果我禁用该库,一切正常!人们可能会发现该库没有正确使用(我使用的是傻瓜教程中最简单的示例)。但是,我认为这与我用来开发网站的框架有关:Symfony2。

任何想法?

forms textarea tinymce symfony

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

设置TinyMce编辑器的焦点onload

当单击编辑按钮时,它会显示tinymce文本编辑器,但问题是它没有将焦点设置在从第二个开始的编辑器的第一次加载上,它工作正常

以下是我尝试过的

超文本标记语言

<h3>History Review <a href="#" class="blue_edit_btn" id="history_review_link" onclick="bgshoweditor('history_review')" >Edit</a></h3>
Run Code Online (Sandbox Code Playgroud)

jQuery

function bgshoweditor(editorid)
{

    $("#"+editorid+"_div").hide();
    $("#"+editorid).show(); 
    tinyMCE.execCommand('mceRemoveControl', false, editorid );
    tinyMCE.execCommand('mceAddControl', true, editorid );
    tinyMCE.execCommand('mceFocus', false, editorid );      
    tinyMCE.activeEditor.selection.select(tinyMCE.activeEditor.getBody(), true);
    tinyMCE.activeEditor.selection.collapse(false); 
}
Run Code Online (Sandbox Code Playgroud)

html javascript jquery tinymce tinymce-4

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

TinyMCE 拖放图像上传问题

我已经使用 TinyMCE 一段时间了,但现在想实现拖放图像上传功能。(即,您可以将图像从本地计算机拖到文本编辑器中,调整大小和重新定位等,然后将其上传到服务器)我本来打算购买 Redactor 来实现此功能,但后来我注意到 TinyMCE 有 Paste_data_images 选项,允许图像直接拖/粘贴到编辑器中。这似乎将其转换为内联 Base64 编码数据。

我怀疑并且已经阅读过,理论上可以将此值提交到服务器,从Dom中提取base64 uri,将它们写入文件,用新创建文件的路径替换SRC,然后提交文本到数据库。有人实现过这个吗?

根据我最初的探索,我发现问题可能是:

  • 巨大的图像(~100mb)可能会被粘贴到文本框中,这可能会导致问题。
  • Internet Explorer 11 和 Edge 浏览器似乎根本不允许将图像拖到文本框中。

有没有人设法让这个工作顺利进行?

此后我仔细检查了 Redactor,发现它也不适用于 IE 和 Edge。

javascript drag-and-drop tinymce file-upload redactor

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

带 React 的 TinyMCE 编辑器无法访问本地文件

我将tinyMCE编辑器插件与react js一起使用。我正在尝试将文件从本地计算机上传到编辑器,然后上传到 s3。我可以将照片拖放到编辑器中,但是,当我单击“插入照片”按钮时,我无法访问我的文件系统。有什么建议么?

class Editor extends React.Component{

    handleEditorChange = (e) => {
        console.log('e',e);
        console.log('Content was updated:', e.target.getContent());
    }


    render(){
        return(
            <TinyMCE
                content="<p>This is the initial content of the editor</p>"

              config={{
                height:600,
                paste_data_images: true,
                plugins: [
                    'advlist autolink lists link image charmap print preview anchor',
                    'searchreplace wordcount visualblocks code fullscreen',
                    'insertdatetime media table contextmenu paste code'
                  ],
                  toolbar: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',                file_picker_types: 'file …
Run Code Online (Sandbox Code Playgroud)

javascript tinymce tinymce-4 reactjs

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

如何防止TinyMCE插入 进入空元素而不更改初始化代码

在某些 CMS 中,我需要一些以空 html 元素开头的文本。

<div class="invisible-div"></div>
<p>Some text</p>
Run Code Online (Sandbox Code Playgroud)

文本通过TinyMCE输入。然而TinyMCE会自动放入&nbsp;空元素。

<div class="invisible-div">&nbsp;</div>
<p>Some text</p>
Run Code Online (Sandbox Code Playgroud)

通常我只会更改TinyMCE 的初始化方式来防止这种行为,但在这种情况下,我只是 CMS 的用户,所以我无法更改代码。即使如此,我的文本中仍然可以有空元素吗?

html tinymce

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

在 TinyMCE 编辑器中显示视频

下午好,我来详细解释一下这个问题。我正在将 TinyMCE 编辑器版本连接4.6.4到我的网站。它在媒体插件中有插件,您可以通过它将媒体文件插入编辑器。

因此,我将视频添加到编辑器中。实际上,您可以通过不同的方式添加视频,其中之一就是为编辑器提供直接链接,我就是这样做的。

media_live_embeds编辑器的初始化中有一个参数,可以将其插入到true或 的位置false,如果该参数插入为true,则添加的视频可以直接在编辑器中播放。

问题是,如果我从我的网站提供视频链接(vvv.mp4示例),那么它不会播放(就像参数插入到 media_live_embeds: false 中一样)。

但是,如果我添加来自 youtube 的视频链接(示例https://www.youtube.com/watch?v=q6_yRWPd4Yc),那么它就可以工作。

屏幕上有 2 个视频,第一个带有 YouTube 链接,第二个带有来自该网站的链接,第一个视频是直接从编辑器播放的,第二个则不是。

在此输入图像描述

我有什么错?谁遇到过这个问题?

这是小编整理的,大家可以自己测试一下。

html javascript tinymce tinymce-4 tinymce-plugins

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

React TinyMce:“tinymce”未定义 no-undef

在使用tinymce https://github.com/pc-magas/tinymce_demo的示例演示中,我尝试通过https://www.tinymce.com/docs/api/tinymce/tinymce中提供的api更改tinymce的内容。 editorcommands/在我的例子中,我希望当单击“hello”按钮时将“Hello”字符串插入编辑器的内容中。

尝试执行此操作的代码是(https://github.com/pc-magas/tinymce_demo/blob/master/src/MyEditor.js):

import React, { Component } from 'react';
import TinyMCE from 'react-tinymce';


/**
 * Basic Editor
 */
class MyEditor extends Component {

    constructor(props) {
        super(props)
        this.state={text:''}
        this.tinyMCE=null;
    }

    onTextChange(e) { 
        this.setState({text:e.target.getContent()})
    }


    doStuffWhenFileChanges(event) {
      event.preventDefault();
      console.log(this.tinyMCE);
      this.tinyMCE.context.execCommand('mceInsertContent', false ,"Hello");
    }


    render(){
      return (
        <div>
          <TinyMCE
            ref = { (el)=>{ this.tinyMCE=el; } }
            content = ""
            config = {{
              plugins: 'link image code paste autolink media autoresize',
              toolbar: 'undo redo | bold …
Run Code Online (Sandbox Code Playgroud)

tinymce reactjs

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

TinyMCE 上的上标和下标按钮

嘿超级简单的问题。有没有办法将上标和下标按钮添加到 TinyMCE 编辑器中。我目前正在将它与 AngularJS 一起使用,所以我当前的格式如下:

<textarea
    ng-model="myModel"
    options='{
        "type":"tinymce",
        "config":{
        "plugins":["lists link image charmap print media save table template paste imagetools toc"],
        "toolbar":"undo redo bold italic underline bullist link charmap"                        
        }
    }'>
</textarea> 
Run Code Online (Sandbox Code Playgroud)

用一个处理一切的指令。我知道我可以在“格式”下拉菜单下的菜单栏中获取上标和下标。但我需要它作为按钮。

这是我用于tinyMCE的角度包装器: https: //github.com/angular-ui/ui-tinymce

html tinymce angularjs

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

将 TinyMCE WYSIWYG HTML 编辑器集成到 React Native 应用程序

我正在尝试将 TinyMCE WYSIWYG HTML 编辑器合并到 React Native WebView 组件中。有办法执行这个任务吗?

javascript wysiwyg tinymce webview react-native

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

如何在laravel模型中从html获取纯文本?

我有一个名为 的数据库列,description我在其中保存了来自tinymce 编辑器的输入。数据是这样的,

<p><strong>Paragliding </strong></p>
<p>Paragliding is the recreational and competitive adventure sport of flying paragliders: lightweight, free-flying, foot-launched glider aircraft with no rigid primary structure. The pilot sits in a harness suspended below a fabric wing.<br /> </p>
Run Code Online (Sandbox Code Playgroud)

我可以通过以下方式轻松显示视图中的数据,

{{$data->description}} or {!! $data->description !!}
Run Code Online (Sandbox Code Playgroud)

但是,我需要进行一些处理才能从文本中获取 30 个单词,并在模型中使用以下代码,

/**
 * @param $sentence
 * @param int $count
 * @return mixed
 */
function get_words($sentence, $count = 30) {
    preg_match("/(?:\w+(?:\W+|$)){0,$count}/", $sentence, $matches);
    return $matches[0];
}

/**
 * @return short_description
 */
public …
Run Code Online (Sandbox Code Playgroud)

php string tinymce laravel eloquent

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