`

修正kindeditor带base标签页面图片显示的问题

 
阅读更多
问题详见：
http://www.kindsoft.net/view.php?bbsid=5&postid=2713
http://www.kindsoft.net/view.php?bbsid=4&postid=6332&cmtid=8839

原因：富文本编辑器的所见即所得功能是通过插入iframe实现的，如果iframe里面没有base标签，浏览器自然会选用当前页面的相对路径。

解决办法：往富文本编辑器的iframe插入当前页面的base标签路径。

Kindeditor版本：最新的4.1.7

打开需要用到的kineditor-all.js或者kindeditor.js，修改后自行压缩

找到 function _getBasePath()
在下面添加： 
function _getPageBasePath() {
	var els = document.getElementsByTagName('base');
	for (var i = 0, len = els.length; i < len; i++) {
		var href = els[i].href;
		if (href) {
			return href;
		}
	}
	return '';
}
K.pageBasePath = _getPageBasePath();

再找到 function _getInitHtml(themesPath, bodyClass, cssPath, cssData)
在 '<head><meta charset="utf-8" /><title></title>', 下面新增一行 
(K.pageBasePath === '' ? '' : '<base href="' + K.pageBasePath + '">'),


问题解决
分享到：
| 研究SpringMvc 3.2的<mvc:annotation-driv ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    完整版kindeditor修正上传图片问题

    在"完整版KindEditor修正上传图片问题"这个主题中，我们将探讨如何解决KindEditor在处理图片上传时可能遇到的问题，以及如何配置和定制编辑器以适应不同的后台环境。 首先，KindEditor提供了一个`demo`文件夹，其中...

    kindeditor(带压缩图片功能）

    然而，原始的KindEditor可能并不直接支持图片上传后的压缩，这可能导致用户上传大尺寸图片时，服务器存储空间消耗过大，网页加载速度变慢等问题。 描述中提到的“带压缩图片功能”，意味着这个版本的KindEditor已经...

    kindEditor4.1版修改上传图片宽高(图片自适应)

    为了改善用户体验，我们需要实现图片自适应功能，即无论页面如何缩放或在不同分辨率的设备上展示，图片都能够保持原有的比例并完整显示。 具体需求如下： - 图片宽度能够自动根据容器（如浏览器窗口）的宽度调整，...

    kindeditor图片上传后生成带域名绝对路径配置及提交空格无法保存解决方法

    ### KindEditor 图片上传后生成带域名绝对路径配置方法 #### 一、KindEditor简介与配置背景 KindEditor是一款基于JavaScript的开源富文本编辑器，它具有轻量级且易于集成的特点，在许多Web项目中被广泛应用。对于...

    vue 使用kindeditor粘贴复制图片上传给自己服务器，单独图片上传

    vue 使用kindeditor粘贴复制图片上传给自己服务器，单独图片上传,避免用户到处寻找，解决了用户粘贴复制截图时候，图片变成base64,上传给后台的时候长度过于长，所以在粘贴的时候就上传给服务器，最后以形式显示在富...

    kindEditor+图片批量上传

    "KindEditor图片批量上传工具"是一款专为网页设计者和内容创作者打造的高效图片上传解决方案。这款工具允许用户在Web界面一次性上传多张图片，极大地提升了工作效率，特别是对于那些需要频繁处理文字和图像，比如...

    KindEditor上传图片和管理图片

    服务器端接收到请求后，通常会将图片保存到磁盘，并返回一个图片URL或者存储标识，KindEditor根据这个返回值更新编辑器中的图片源，从而完成图片的上传显示。 描述中提到的"管理图片采用直接读取磁盘文件模式"，...

    kindeditor--4.1.12 解决flash批量上传图片按钮不显示与支持video视频

    在Flash批量上传图片功能上，KindEditor 4.1.12修复了按钮不显示的bug，这可能是因为在某些浏览器或操作系统环境下，Flash元素的渲染出现了问题。修复这个问题通常涉及调整Flash对象的嵌入方式，确保兼容性，或者...

    kindeditor富文本，多图上传，去除flash插件，解决无法展示选择图片按钮问题，以及添加上传后结果展示

    本主题主要探讨如何在KindEditor中实现多图上传功能，并解决因移除Flash导致的选择图片按钮无法展示的问题，同时添加上传后的图片结果展示。 一、多图上传功能 多图上传是现代富文本编辑器必备的功能之一，它允许...

    kindeditor上传图片自动压缩过大的图片

    标题和描述提到的问题，就是在KindEditor中实现这一功能的方法。 首先，我们需要了解KindEditor的图片上传流程。当用户在编辑器中选择图片并提交上传时，KindEditor会调用预设的上传处理程序，通常是通过一个服务器...

    KindEditor图片上传相关问题

    KindEditor会根据这个响应更新编辑器中的图片显示。 在实际开发中，`UploadService.java`可能会包含上述功能的实现，通过分析这个文件，我们可以学习如何构建一个完整的图片上传服务，包括错误处理、日志记录和性能...

    kindeditor 4.1.4 带flv播放修正自动播放问题

    KindEditor 是一款开源的富文本编辑器，广泛应用于网页内容编辑和管理，它提供了丰富的功能，如文字格式化、图片上传、链接插入等。在4.1.4这个版本中，针对用户反馈的问题进行了修正，特别是针对FLV视频播放的自动...

    kindEditor批量传图配置

    ### kindEditor批量传图配置详解 ...这些文件通常位于kindEditor的根目录下，需要通过`&lt;script&gt;`和`&lt;link&gt;`标签引入到HTML页面中。例如： ```html &lt;script charset="utf-8" src="/editor/kindeditor.js"&gt; ...

    kindeditor图片上传携带token字段

    本文将详细讲解如何在KindEditor中实现图片上传时携带token字段，以确保数据的安全性和完整性。 首先，理解“token”在Web开发中的作用至关重要。Token通常用于验证客户端请求的合法性，防止跨站请求伪造（Cross-...

    kindeditor + video修正版

    总的来说，“kindeditor + video修正版”是一个针对性的优化更新，主要解决了KindEditor在处理视频插入时的定位问题，提高了编辑器的稳定性和用户体验。对于使用KindEditor的开发者来说，这个修复版本将更有利于他们...

    kindeditor添加图片压缩功能(Asp.net版)

    6. **返回响应**：完成图片处理后，你需要将压缩图片的URL返回给KindEditor，以便它能正确显示。可以返回JSON格式的数据，包含图片的URL和其他相关信息。 7. **安全考虑**：为了防止恶意文件上传，应检查上传的文件...

    为 KindEditor 实现图片上传

    在使用 KindEditor 进行文本编辑时，一个常见的需求是实现图片上传功能，以便用户能够方便地将本地图片插入到编辑的内容中。本篇文章将详细介绍如何为 KindEditor 实现图片上传功能。 首先，我们需要理解 ...

    JSP版的完善KindEditor在线编辑器(带附件上传与图片按日期分类管理功能)

    JSP版的完善KindEditor在线编辑器(带附件上传与图片按日期分类管理功能) 1.集合了日期、时间、在线预览和特殊字符插件,采用3.0皮肤； 2.将图片上传与管理的JSP页面改写成SERVLET，同时去除JSON包； 3.添加图片压缩...

    JSP kindeditor编辑器使用，能上传图片，解决乱码问题

    在本文中，我们将深入探讨如何在JSP环境中使用KindEditor编辑器，以及如何解决与上传图片和乱码问题相关的挑战。KindEditor是一款功能强大的HTML在线编辑器，它为用户提供了一个类似Word的界面来编辑网页内容。以下...

Magicbox
Global site tag (gtag.js) - Google Analytics