`

百度编辑器对H5代码修改

 
阅读更多

在百度编辑器中,出于安全考虑,会将源码的div标签替换为p标签,li标签上的样式删除,自动生成&nbsp等。

 

这里根据以上说的三点进行解决:

div标签替换为p标签:

在ueditor.all.js文件内搜索allowDivTransToP,找到如下的代码,将true设置为false

me.setOpt({
    'allowDivTransToP':false,
    'disabledTableInTable':true
});

 

li标签上的样式删除:

在ueditor.all.js文件内,找到以下代码,注释掉即可

case 'li':
	var className = node.getAttr('class');
	if (!className || !/list\-/.test(className)) {
		node.setAttr()
	}
	var tmpNodes = node.getNodesByTagName('ol ul');
	UE.utils.each(tmpNodes, function (n) {
		node.parentNode.insertAfter(n, node);
	});
	break;

 

自动生成&nbsp:

在ueditor.all.js文件中找到下面的代码,将 替换为‘’即可

function isText(node, arr) {
    if(node.parentNode.tagName == 'pre'){
        // 源码模式下输入html标签,不能做转换处理,直接输出
        arr.push(node.data)
    }else{
        arr.push(notTransTagName[node.parentNode.tagName] ? 
            utils.html(node.data) : node.data.replace(/[ ]{2}/g,'&nbsp'))
    }
}

 

li标签内自动加p标签:在ueditor.all.js文件内,找到以下代码,注释掉即可

 

utils.each(root.getNodesByTagName('li'),function(li){
	var tmpP = UE.uNode.createElement('p');
	for(var i= 0,ci;ci=li.children[i];){
		if(ci.type == 'text' || dtd.p[ci.tagName]){
			tmpP.appendChild(ci);
		}else{
			if(tmpP.firstChild()){
				li.insertBefore(tmpP,ci);
				tmpP = UE.uNode.createElement('p');
				i = i + 2;
			}else{
				i++;
			}

		}
	}
	if(tmpP.firstChild() && !tmpP.parentNode || !li.firstChild()){
		li.appendChild(tmpP);
	}
	//trace:3357
	//p不能为空
	if (!tmpP.firstChild()) {
		tmpP.innerHTML(browser.ie ? '&nbsp;' : '<br/>')
	}
	//去掉末尾的空白
	var p = li.firstChild();
	var lastChild = p.lastChild();
	if(lastChild && lastChild.type == 'text' && /^\s*$/.test(lastChild.data)){
		p.removeChild(lastChild)
	}
});

 

 

 

参考:http://blog.csdn.net/shahexiaoxiami/article/details/44103009

分享到:
评论

相关推荐

    利用WebSocke+Ueditor实现兼容手机端页面的WEB实时编辑器

    Ueditor是由百度开发的一款功能强大的富文本编辑器,支持图片上传、视频插入、表格编辑等多种功能。它提供了一套完整的API接口,允许开发者根据实际需求进行定制和扩展。在手机端,Ueditor经过优化,能够适应不同...

    coco2d源码(QP-010)H5至尊卡五星房卡麻将源码

    - **强大的编辑器支持**:提供了 Cocos Creator 这样强大的编辑器,支持即时预览等功能。 ### 二、QP-010 H5 至尊卡五星房卡麻将源码 #### 2.1 H5 游戏概述 H5(HTML5)是一种基于 Web 技术的游戏开发方式,它不...

    HBuilder使用教程及下载

    2. **编写H5页面**:使用HBuilder的编辑器编写HTML、CSS和JavaScript代码,构建应用界面和逻辑。 3. **配置资源**:添加应用图标、启动页、权限设置等资源,以符合原生应用的标准。 4. **设置APP信息**:填写应用的...

    最全Html情人节告白源码(下载即能跑)

    你可以通过编辑器打开这些文件,查看和修改代码,然后在浏览器中预览效果。 在使用这些源码时,你可以根据自己的需求进行个性化定制,比如更换文字内容、添加个人照片,或者调整颜色方案以匹配你的心意。同时,这也...

    简洁响应式扁平化后台管理系统模板源码下载HTML源码H5整站.zip

    3. **UEditor 1.4.3**:这是百度开发的一款富文本编辑器,广泛应用于内容编辑和发布场景。它支持图片上传、链接插入、文字格式化等多种编辑功能,并且提供了ASP版本的后端处理程序,方便与服务器进行交互。此外,...

    Phpcms X (原PHPCMS)长期维护版

    本优化版将持续更新(可后台一键更新),获取更新请查看PhpcmsX网站 ... PHPCMS X 是基于PHPCMS V9 (9.6.3)上优化完善而来的,对PHPCMS V9进行了全面的优化和持续的安全修复及维护,并对...多功能编辑器 最后更新2021/0915

    HBuilderX软件(用于前端MOA端开发软件)

    - **实时预览**:内置浏览器预览功能,代码修改后可即时查看效果,方便调试。 - **语法高亮与代码格式化**:提供多种语言的语法高亮,支持自定义代码格式化规则,提升代码可读性。 - **Git集成**:内置Git管理...

    uniapp商城,小程序

    uniapp的开发环境主要包括HBuilderX编辑器,它集成了代码编辑、预览、发布等一站式服务。uniapp的开发模式遵循Vue.js的MVVM架构,使得代码结构清晰,易于理解和维护。同时,uniapp通过插件市场提供了大量第三方组件...

    虚谷号python库清单1

    2. astor: AST抽象语法树类封装器,提供了对抽象语法树的封装和操作,常用于代码分析和优化。 3. attrs: 类封装器,提供了对类的封装和操作,常用于实现单例模式、工厂模式等。 4. autobahn: 网络客户端和服务器,...

    mui 案例 社交APP

    3. 用户资料:展示和编辑用户信息,包括头像上传、个人信息填写等,可以通过mui的图片选择器和表单组件完成。 4. 搜索功能:利用输入框监听事件,结合后台搜索算法,实现实时搜索其他用户或话题。 5. 地图定位:集成...

    云贝uni-app微信小程序运行

    7. **运行与调试**:在开发环境中,需要使用HBuilderX编辑器或微信开发者工具进行代码编写和预览。首先,需要安装并配置好开发环境,然后导入yunbei-uniapp-master项目,配置微信小程序的相关参数,最后运行项目并在...

    SDCMS四网合一企业网站管理系统-PHP

    标签生成器、内容采集插件、百度内容推送、百度电子地图等多种插件。 本次更新细节如下: 四网合一企业网站管理系统V2.2版本详细更新细节如下: 【新增的功能】 01、新增循环标签的top参数可以传递变量的功能 02、...

    EmployApp.rar

    它基于Vue.js语法,支持H5、iOS、Android等多平台,极大地简化了开发者的工作流程。对于"某某兼职类型APP"而言,选择uni-app作为开发工具,无疑是为了实现高效且跨平台的前端应用开发。 1. uni-app基础知识 - Vue....

Global site tag (gtag.js) - Google Analytics