标签: wysiwyg

CKEditor:编辑器主体的类或ID

我在页面上有一个CKEditor实例.我试图给CKEditor的主体一个类或ID,以便它匹配我在样式表中定义的一些样式.

有一个API文档可以访问相应的DOM元素,但我似乎无法让它工作.我试图以这种方式查询的所有对象都是未定义的.

有人知道如何做到这一点,或者如何正确地解决CKEditor的dom元素？

编辑:谢谢大家,nemisj的答案为我做了,但出于某种原因,我没有在这个问题中设置"接受"的复选标记.

javascript css wysiwyg ckeditor

Pek*_*ica

2009 12-16

12
推荐指数

2
解决办法

2万
查看次数

JS:获取contentEditable div中所有选定节点的数组

嗨,我一直在使用contentEditable一段时间了,我觉得我对它有很好的处理.回避我的一件事是如何获得部分或完全在用户选择范围内的所有节点的引用数组.有人有个主意吗？

这是从一开始:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function getSelectedNodes(){
    var sel = window.getSelection();
    try{var frag=sel.getRangeAt(0).cloneContents()}catch(e){return(false);}
    var tempspan = document.createElement("span");
    tempspan.appendChild(frag);

    var selnodes = Array() //<<- how do I fill this array??
    var output = ''
    for(i in selnodes){
        output += "A "+selnodes[i].tagName+" was found\n"
        //do something cool with each element here...
    }
    return(output)
}
</script>
</head>

<body contentEditable="true" onkeypress="return(keypress(event))">
<div>This <strong>div</strong> is <em>content</em> <span class='red'>editable</span> and has …

Run Code Online (Sandbox Code Playgroud)

html javascript wysiwyg

cro*_*lee

lucky-day

12
推荐指数

1
解决办法

8135
查看次数

有没有JavaScript实时语法荧光笔？

我发现了突出显示预先存在的代码的语法高亮显示,但我想在你用WYSIWYG风格的编辑器输入时这样做.我不需要自动完成的功能,只需突出显示.

作为后续问题,stackoverflow使用的WYSIWYG编辑器是什么？

编辑:感谢下面的答案,我发现两个看起来可能符合我的需求: EditArea和CodePress

编辑:也看到这个问题:https:
//stackoverflow.com/questions/379185/free-syntax-highlighting-editor-control-in-javascript

javascript wysiwyg syntax-highlighting

作者

2017 05-23

11
推荐指数

2
解决办法

5439
查看次数

WYSIWYG与WYSIWYM

哪一个在基于Web的应用程序中更好,更理想？

编辑:

其实我正在开发一个社区网站.因此用户的级别可能会有所不同.听到WYSIWYG编辑器的XSS安全问题.我也不熟悉WYSIWYM编辑器及其功能.据我所知,WYSIWYM编辑器中的功能与其他功能相比较少.我想到一个名为"WMD:Wysiwym Markdown编辑器".它很容易使用.

因此,安全性和易用性应该存在.在这种情况下哪个编辑器会更好.

wysiwyg editor wysiwym

rah*_*hul

2009 07-07

11
推荐指数

3
解决办法

6697
查看次数

构建一个简单的WYSIWYG编辑器

我知道创建一个所见即所得/富文本编辑器是一件很荒谬的事情,因为实现跨浏览器支持需要许多不同的,烦人的事情.但是,我目前正在开发的项目需要一个非常简单的WYSIWYG编辑器(三个选项,链接,粗体和斜体).

我的问题是,我是否会花费尽可能多的时间来定制和削减TinyMCE以满足我的要求,或者是创建我自己的一个相当简单的任务,因为只有三个选项(没有像文本调整大小或撤消/重做)？

此外,仍然是iFrame和designMode的普遍共识还是我们可以使用contentEditable在HTML5列车上走得很远？

javascript jquery wysiwyg

Dor*_*use

lucky-day

11
推荐指数

1
解决办法

2412
查看次数

如何使用高级主题,简单布局将标题(h1,h2 ...)按钮添加到tinyMCE？

我有一个使用高级主题的tinyMCE编辑器.我在高级主题上使用简单布局,因此我可以在init()上定义自己的工具栏,而不必深入了解tinyMCE正在做什么.

我遇到的问题是我的编辑器没有添加标题元素的按钮.我迫切需要这个选项,但没有找到关于这个问题的实用建议.

我正在做的一切都发生在tinymce.init()函数中,我在下面粘贴了它:

$("textarea.tinymce").not(".simple").tinymce({
            script_url : "/_lib/script/tiny_mce/tiny_mce.js",
            plugins : "wordcount,paste,spellchecker,table",
            theme : "advanced",
            theme_advanced_layout_manager : "SimpleLayout",
            theme_advanced_statusbar_location : "bottom",
            theme_advanced_toolbar_location : "top",
            theme_advanced_buttons1
                : "bold,italic,underline,strikethrough,|,sub,sup,|,charmap,|,forecolorpicker",
            theme_advanced_buttons2
                : "undo,redo,|,cut,copy,pastetext,pasteword,|,link,unlink,anchor,|,image,code",
            theme_advanced_buttons3 : "",
            theme_advanced_toolbar_align : "left",
            height : 480,
            apply_source_formatting : false,
            convert_fonts_to_spans : true
        });

Run Code Online (Sandbox Code Playgroud)

我正在使用jquery插件访问tinyMCE(我确定这与我的问题无关,但它解释了代码).

我有一个想法是使用theme_advanced_styles选项,但我不认为这将允许我插入实际的标题标签,而只是设置我的标记与跨度和什么看起来像标题.

任何想法都非常感激.干杯,J

html javascript wysiwyg tinymce html-heading

Joe*_*een

2012 04-10

11
推荐指数

2
解决办法

1万
查看次数

tinyMCE - 如何处理图像上传

我有一个人们发布新闻的网站,它是用PHP编写的.

到目前为止,发布故事的人有文本输入的文本区域,以及上传故事图像的表单字段.

现在我正在升级网站,我正在考虑给人们更多的灵活性,所以我打算使用一个javascript WYSIWYG文本编辑器.

在回顾了最流行的,或者至少是我发现谷歌搜索的那些之后,我认为tinyMCE是最好的记录,这就是为什么我认为我会选择它,尽管我刚刚使用它约4-5小时,所以我真的不在乎我是否必须切换到另一个编辑器.

当你在textarea中拖放图像时,tinyMCE在base64中对图像进行编码,并将其用作图像标记的src属性.

我想知道,有没有办法让tinyMCE将图像作为文件上传到服务器,以便我可以用php处理它们(制作缩略图,根据我的意愿命名并存储它们)？

如果没有,是否有一个编辑器可供选择？

javascript php jquery wysiwyg text-editor

ppp*_*ppp

lucky-day

11
推荐指数

2
解决办法

4万
查看次数

HTML WYSIWYG edtor:为什么可编辑内容在iFrame中移动

为什么可编辑的html会移动到iFrame中？我分析了不同的编辑器(TinyMce,CKEditor等),并将可编辑内容移动到一个单独的iFrame中,它们放在原始文本上.

这是什么技术原因.我试验过contenteditable="true",这也是所有这些编辑的基础,并没有找到理由做到这一点.

html wysiwyg tinymce editor ckeditor

Ste*_*fan

2013 06-20

11
推荐指数

2
解决办法

4619
查看次数

内容可编辑文本编辑器

我已经尝试了几个HTML编辑器,包括TinyMCE,CKEditor和现在的NicEdit.NicEdit在一个方面很好 - 它很容易定制.但是,我发现它们都有产生非常差的HTML的倾向.不一定是这样,但是因为他们没有做很多工作来正确解释无效的用户操作,例如在没有先做出选择的情况下尝试设置某些内容.

最终使用包含类似内容的HTML非常容易

<span style='color:#ff0000'><span style='color:#ff0000'><span style='color:#ff0000'>Red</span></span></span>

Run Code Online (Sandbox Code Playgroud)

我是否正确地认为这几乎是内容可编辑概念的限制？如果目的是电子邮件或在诸如此类的论坛上发布帖子,那么糟糕的HTML并不重要,但如果生成的HTML必须在网页的上下文中使用,那么生活得相当不舒服.如果所有这些都是对的,那么替代方案是什么？也许是一个基于Flash的插件编辑器,可以生成更好的HTML并且更难以解释用户想要做什么？

我认为原则上可以研究生成的输出并在必要时清除六角形的跨度,但这可能是一项艰巨的任务.

html wysiwyg contenteditable

Dro*_*dOS

2013 04-18

11
推荐指数

1
解决办法

4214
查看次数