TOGOUTECH

javascript - 输入新段落时防止属性被复制?

coder 2024-05-16 原文

在 CKEditor 中创建新段落时,前一段的属性(样式、类)会被复制到新段落上。有办法避免这种情况吗?

例如,如果我在一个居中的段落中书写并按 enter 键创建一个新段落,我的用户希望新段落是一个简单的

而不“继承”前一个段落默认。


编辑

我设法使用 Reinmar 的提示(危险地未经测试)得到它。这就是我的结局;我希望这可以帮助别人。如果你们在这里看到明显的错误,请告诉我

CKEDITOR.on('instanceCreated', function(e) {
    e.editor.on('key', function(evt) {
        if (evt.data.keyCode === 13) {
            // if we call getStartElement too soon, we get the wrong element
            setTimeout(function () {
                var se = e.editor.getSelection().getStartElement();
                if(se.getName() == "span") {
                    var text = se.getText(); // Store text, we are about to nuke the spans
                    while (se.getName() == "span") { // possible infinite loop danger
                        se = se.getParent();
                    }
                    if (text.length == 0)
                        se.setHtml(" "); // It's important that this is not empty
                    else
                        se.setHtml(text);
                }
                debug(se.getHtml());
                se.removeAttribute("class");
                se.removeAttribute("mycustomattr");
                se.removeAttribute("myothercustomattr");
                window.bla = se; // useful for debugging
            }, 10);
        }
    });
}); 

最佳答案

我在即将推出的 CKEditor v4(当前的夜曲)中遇到了类似的问题。我从我的自定义图像浏览器插入一个带有图像和自定义类的段落,CKEditor 一直将这些类复制到在图像之后创建的段落。

我不喜欢 key 事件之后调用 setTimeout 的想法,所以我稍微检查了一下源代码,发现它非常简单。

当您按下 enter 键时,CKEditor 实际上会发出 enter 命令。您需要做的就是设置一个 afterCommandExec 事件并找到新创建的空元素:

editor.on('afterCommandExec', function (e) {
    if (e.data.name == 'enter') {
        var el = e.editor.getSelection().getStartElement();

        // when splitting a paragrah before it's first character,
        // the second one is selected
        if (el.getHtml() != '<br>') {
            if (el.hasPrevious() && el.getPrevious().getHtml() == '<br>') {
                el = el.getPrevious();
            } else {
                // both paragraphs are non-empty, do nothing
                return;
            }
        }

        // modify el according to your needs
    }
});

希望这对您有所帮助!

关于javascript - 输入新段落时防止属性被复制?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12914536/

有关javascript - 输入新段落时防止属性被复制?的更多相关文章

  1. javascript - 如何在链接点击上播放 mp3 - 2

    有一个简单的链接01.TheNameofTrack如何在用户点击链接时播放mp3文件?请帮助我找到一些简单有效的解决方案。谢谢。感谢您的帮助。我选择了这个解决方案http://www.schillmania.com/projects/soundmanager2/demo/play-mp3-links/最适合我的情况。 最佳答案 使用HTML5Yourbrowserdoesnotsupporttheaudioelement.document.getElementById("link_id").addEventListener("cli

  2. javascript - 无法在 Express 中呈现 swig 模板 - 2

    所以我正在尝试使用consolidate.js渲染swigtemplates使用express,但是当我尝试从另一个模板“扩展”一个模板时出现以下错误:Error:ENOENT,nosuchfileordirectory'//one.html在我的app.js文件中,我将swig设置为我的渲染引擎(仅包括相关代码):varconsolidate=require('consolidate');app.set('viewengine','html');app.set('views',__dirname+'/views');app.engine('.html',consolidate.swi

  3. 防止暴力破解ssh的四种方法 - 2

    一.方法介绍防止暴力破解的四种方法:1密码要写的足够的复杂,通常建议将密码写16位,并且无连贯的数字或者字母;当然也可以固定一个时间修改一次密码,推荐是一个月修改一次会稳妥一些2修改ssh的端口号,给对方一些迷惑性,因为远程linux服务器默认端口是22,修改成其他的端口,三位数,四位数的都行,这样能避免大部分的暴力破解的可能性3通常我们远程登录都是使用root用户进行登录的,我们将root用户设置成系统用户,并且不允许root账号直接登录,添加一个普通用户,给它赋予root用户的权限,这样也能极大的避免对方破解成功的可能性。4使用秘钥认证的方式登录,在客户端上生成公钥和私钥,将公钥发送给需要

  4. Javascript:构造函数中的回调 - 2

    我正在尝试为一个对象编写OOjavascript,该对象具有昂贵的初始化过程,完成后会回调一个函数。问题在于调用者需要在回调例程中使用同一对象的函数,而该对象尚不存在://ctorforfooobjectfunctionfoo(callback){//doslowinitializationhere..//callbackwhendonecallback();};foo.prototype=function(){return{//doStuffmethoddoStuff:function(){alert('stuffdone');}};}();//instantiatethefooob

  5. 接口测试CURL复制以及postman的Code功能 - 2

    1.复制CURL在需要抓取url的网址中打开F12进行调试,打开Network  右键点击选择copy下的curlbash 2.postman导入打开postman点击import打开后就是下面这个页面选择Rawtext在下方的Pasterawtext粘贴上你需要请求的curl粘贴后点击高亮continue按钮 点击后会有新弹窗再点击import 保存后可直接send发送 3.postmancode生成 看了很多postman里自动生成code的教程,非常动心,但是打开自己的postman却没找到那个传说中在cookies旁边的code按钮。新版postman的code按钮如下图所示选择自己想

  6. javascript - 如何将以毫秒为单位的日期转换为 iso 格式的 javascript? - 2

    这个问题在这里已经有了答案:关闭10年前。PossibleDuplicate:HowdoIoutputanISO-8601formattedstringinJavascript?如果我有一个以毫秒为单位表示日期的整数,将其转换为iso格式的语法是什么?

  7. javascript - 在 javascript/DOM 中存储文本内容的最快和/或最干净的方法是什么? - 2

    按照目前的情况,这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visitthehelpcenter指导。关闭10年前。我通常会看到版本1,但我从事的一些开源项目使用版本2,而我过去也使用过版本3。有没有人有更优雅的解决方案,也许是更具可扩展性的解决方案?版本1:vartext1='thisismyscript\'scontent';版本2:Thisismycontentvartext1=$('#text1').html();版本3:vartext1=$('#text1'

  8. javascript - 优化javascript代码以使用整数运算 - 2

    有一些算法可以“非常好”地解决问题,前提是“非常好”意味着最小化浮点算术运算的数量以支持整数算术。以Bresenham'slinealgorithm为例为了弄清楚要填充哪些像素以便在Canvas上画一条线:这个人几乎只用了一些简单的整数运算就使整个过程变得可行。这种事情在很多情况下显然是好的。但是,在javascript中需要大量float学运算的操作值得担心吗?我知道就语言规范而言,一切都几乎是十进制数。我想知道是否实际上尝试让事情尽可能接近整数是否值得——浏览器是否进行了优化以使其值得? 最佳答案 您可以在javascript中

  9. javascript - 使用 YoutubeAPI 播放 youtube 视频直到特定时间并暂停 - 2

    有没有办法使用YoutubeAPI播放视频直到视频中的某个点然后暂停? 最佳答案 我修改了YouTubePlayerAPIReferenceforiframeEmbeds中的代码在一定秒数后暂停播放。Demo代码通过等待onPlayerStateChange事件来工作。当事件触发时,它会检查事件以查看它是否是PLAYING事件。如果是,它会计算从当前时间(getCurrentTime()方法)到所需暂停点(硬编码为stopPlayAt变量)的剩余时间。它设置一个Javascript计时器来等待该差异,然后向API传递一个命令以暂停视

  10. javascript - Chosen.js - 是否可以限制所选项目的数量? - 2

    我有一个客户想要为用户提供从列表中最多选择5个附加选项的选项。我喜欢Chosen.js的概念,但如何限制选择?我想一种解决方案是使用onChange来计算所选的数字,然后禁用剩余的数字,但是有没有更简洁的解决方案? 最佳答案 Chosen提供了一个max_selected_options来允许你这样做:$(".chzn-select").chosen({max_selected_options:5}); 关于javascript-Chosen.js-是否可以限制所选项目的数量?,我们在S

随机推荐