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 - 更改折线选项传单 - 2

    我想在构建后更改分配给Leaflet多段线的选项(然后渲染它)://Addpolylinevarpolyline=L.polyline([],{weight:weight,opacity:1,color:'gray'}).addTo(map);//Attemptstochangecolorpolyline.options.color='blue'//doesn'trenderpolyline.options.color('blue')//throwserrorpolyline({color:'blue'})//th

  2. javascript - Angular JS Controller 和工厂在单独的文件中 - 2

    Web开发和Angular对我来说是全新的。我在同一个文件(app.js)中创建了module、factory和controller。下面是示例代码//MainModulevaripCharts=angular.module('ipCharts',[]);//FactoryipCharts.factory('securityFactory',function($http){varsecurities={};$http.get('api/Securities').success(function(data,status,headers,co

  3. javascript - Node.js 未定义 :1 [SyntaxError: Unexpected end of input] - 2

    当我执行node.js脚本时出现以下错误,我尝试通过添加console.log()来跟踪错误来进行大量调查,但找不到任何解决方案。[注意:我也搜索了其他Stackoverflow解决方案,但都没有帮助]undefined:1{"ydht":{"status":{"code":200,"message":"OK"},"records":[^SyntaxError:UnexpectedendofinputatObject.parse(native)atIncomingMessage.<an

  4. javascript - 未捕获的语法错误 : Unexpected token instanceof (with Chrome Javascript console) - 2

    我很惊讶在Chromejs控制台输入如下代码:{}instanceofObject导致此错误消息:UncaughtSyntaxError:Unexpectedtokeninstanceof谁能告诉我这是为什么以及如何解决它? 最佳答案 instanceof的语法是:RelationalExpressioninstanceofShiftExpression根据ECMA-262§11.8.语句开头的标点符号{被视为block的开始,因此以下}关闭block并结束语句。后面的instanceof运算符是下一条语句的开始,但它不能在开始处,

  5. javascript - res.should.have.status 给我错误 - 2

    我是mocha和should.js的新手。我正在尝试检查响应的状态,但它给了我TypeError:Object#<Assertion>hasnomethod'status'代码是这样的:describe('Localsignup',function(){it('shouldreturnerrortryingtosaveduplicateusername',function(done){varprofile={email:'[email protected]',password:'Testing1234'

  6. javascript - Firefox 在 for 循环中抛出 js 错误 "allocation size overflow" - 2

    下面是我的代码相同的代码可以在本地服务器上运行,但不能在实时运行。htmlC="";htmlC+='<selectname="pagenum"id="pagenum"style="width:135px"onChange="setPageSearchValue(this.value)">';for(i=1;i<=tot_pages;i++){if(i.toString()==document.frmlist.start.value){htmlC+="<opti

  7. javascript - 在 JavaScript 中删除对象数组中的重复对象 - 2

    Object1={connectorIndex:1,nodeID:6,Connectors:Object}Object2={connectorIndex:1,nodeID:6,Connectors:Object}Connector:{name:"ALAND",key:"",description:"Departurecountry(countryfromwhichthegoodsaresent)"}同一个数组中有两个对象。连接器对象是相同的。如何删除重复元素并获得包含一个对象的最终数组?vararray=[object1,object2]

  8. javascript - 如何将 $q 传递给 Angular Directive(指令)链接函数? - 2

    我需要使用$q我的指令的一个link函数。我需要它来包装由参数之一重新调整的可能promise(请参见下面的示例)。但是,我不知道如何将$q依赖项传递给此函数。angular.module('directives').directive('myDirective',function(){return{scope:{onEvent:'&'}//...link:function($scope,$element){$scope.handleEvent(){$q.when($scope.onEvent()){...}}}}}

  9. javascript - 在 JavaScript 中将日期从一种格式转换为另一种格式 - 2

    我在javascript中有一个格式为#1的日期字符串。我需要将其转换为格式#2。当一种格式为“dd/mm/yy”而另一种格式为“mm/dd/yy”时,问题就开始了。格式是动态变化的,我的格式是字符串,但我需要一个类似的函数DatenewDate=convert(currentDate,currentFormatString,newFormatString).我该怎么做? 最佳答案 你应该看看momentjs,这是一个javascript日期/时间库。这样,您就可以轻松地在不同格式的日期之间进行转换。在您的情况下,它将是:strin

  10. javascript - 是否可以使用 $logProvider 登录模块的配置 block ? - 2

    我想在调试时将日志消息输出到控制台。在Controller中工作正常,但无法在模块配置block中工作,例如angular.module('MyApp',[]).run(function($state){//runstuffhere});.config(function($logProvider){$log.debug('Configdebugmessage');});我得到一个错误:errorTypeError:Cannotreadproperty'debug'ofundefined是否可以在模块的配置block中使用logProvid

随机推荐

  1. javascript - 更改折线选项传单 - 2

    我想在构建后更改分配给Leaflet多段线的选项(然后渲染它)://Addpolylinevarpolyline=L.polyline([],{weight:weight,opacity:1,color:'gray'}).addTo(map);//Attemptstochangecolorpolyline.options.color='blue'//doesn'trenderpolyline.options.color('blue')//throwserrorpolyline({color:'blue'})//th

  2. javascript - Angular JS Controller 和工厂在单独的文件中 - 2

    Web开发和Angular对我来说是全新的。我在同一个文件(app.js)中创建了module、factory和controller。下面是示例代码//MainModulevaripCharts=angular.module('ipCharts',[]);//FactoryipCharts.factory('securityFactory',function($http){varsecurities={};$http.get('api/Securities').success(function(data,status,headers,co

  3. javascript - Node.js 未定义 :1 [SyntaxError: Unexpected end of input] - 2

    当我执行node.js脚本时出现以下错误,我尝试通过添加console.log()来跟踪错误来进行大量调查,但找不到任何解决方案。[注意:我也搜索了其他Stackoverflow解决方案,但都没有帮助]undefined:1{"ydht":{"status":{"code":200,"message":"OK"},"records":[^SyntaxError:UnexpectedendofinputatObject.parse(native)atIncomingMessage.<an

  4. javascript - 未捕获的语法错误 : Unexpected token instanceof (with Chrome Javascript console) - 2

    我很惊讶在Chromejs控制台输入如下代码:{}instanceofObject导致此错误消息:UncaughtSyntaxError:Unexpectedtokeninstanceof谁能告诉我这是为什么以及如何解决它? 最佳答案 instanceof的语法是:RelationalExpressioninstanceofShiftExpression根据ECMA-262§11.8.语句开头的标点符号{被视为block的开始,因此以下}关闭block并结束语句。后面的instanceof运算符是下一条语句的开始,但它不能在开始处,

  5. javascript - res.should.have.status 给我错误 - 2

    我是mocha和should.js的新手。我正在尝试检查响应的状态,但它给了我TypeError:Object#<Assertion>hasnomethod'status'代码是这样的:describe('Localsignup',function(){it('shouldreturnerrortryingtosaveduplicateusername',function(done){varprofile={email:'[email protected]',password:'Testing1234'

  6. javascript - Firefox 在 for 循环中抛出 js 错误 "allocation size overflow" - 2

    下面是我的代码相同的代码可以在本地服务器上运行,但不能在实时运行。htmlC="";htmlC+='<selectname="pagenum"id="pagenum"style="width:135px"onChange="setPageSearchValue(this.value)">';for(i=1;i<=tot_pages;i++){if(i.toString()==document.frmlist.start.value){htmlC+="<opti

  7. javascript - 在 JavaScript 中删除对象数组中的重复对象 - 2

    Object1={connectorIndex:1,nodeID:6,Connectors:Object}Object2={connectorIndex:1,nodeID:6,Connectors:Object}Connector:{name:"ALAND",key:"",description:"Departurecountry(countryfromwhichthegoodsaresent)"}同一个数组中有两个对象。连接器对象是相同的。如何删除重复元素并获得包含一个对象的最终数组?vararray=[object1,object2]

  8. javascript - 如何将 $q 传递给 Angular Directive(指令)链接函数? - 2

    我需要使用$q我的指令的一个link函数。我需要它来包装由参数之一重新调整的可能promise(请参见下面的示例)。但是,我不知道如何将$q依赖项传递给此函数。angular.module('directives').directive('myDirective',function(){return{scope:{onEvent:'&'}//...link:function($scope,$element){$scope.handleEvent(){$q.when($scope.onEvent()){...}}}}}

  9. javascript - 在 JavaScript 中将日期从一种格式转换为另一种格式 - 2

    我在javascript中有一个格式为#1的日期字符串。我需要将其转换为格式#2。当一种格式为“dd/mm/yy”而另一种格式为“mm/dd/yy”时,问题就开始了。格式是动态变化的,我的格式是字符串,但我需要一个类似的函数DatenewDate=convert(currentDate,currentFormatString,newFormatString).我该怎么做? 最佳答案 你应该看看momentjs,这是一个javascript日期/时间库。这样,您就可以轻松地在不同格式的日期之间进行转换。在您的情况下,它将是:strin

  10. javascript - 是否可以使用 $logProvider 登录模块的配置 block ? - 2

    我想在调试时将日志消息输出到控制台。在Controller中工作正常,但无法在模块配置block中工作,例如angular.module('MyApp',[]).run(function($state){//runstuffhere});.config(function($logProvider){$log.debug('Configdebugmessage');});我得到一个错误:errorTypeError:Cannotreadproperty'debug'ofundefined是否可以在模块的配置block中使用logProvid