标签: kindeditor

kindeditor编辑器中追加内容滚动条往上顶的bug

kindeditor编辑器中追加内容滚动条往上顶的bug

如题  kindeditor编辑器中追加内容滚动条往上顶的bug  无论滚动条拉到什么地方,一复制粘贴,插入图片,等操作,就会跑到最顶部,所以操作起来很不方便,各位有没有知道这个问题怎么解决???

遇到这个问题是因为使用了br换行引起的。默认使用p标签换行没有这个bug

因为加了换行符号的原因 newlineTag: ‘br’,

            KindEditor.ready(function(K) {
                editor = K.create('textarea[name="content"]', {
                    allowFileManager : true,
                    newlineTag : "br" //或者为"p"  //使用br换行
                });
            });

我调试了一下, 找到了问题的原因!!!  

版本 4.1.10 kindeditor.js 第 1514 行这个函数 box.top 是负数了, 然而这个函数返回后, 第 2763 行执行了 win.scrollTo(pos.x, pos.y); 滚动滚动条.

    pos : function() {

	pos : function() {
		var self = this, node = self[0], x = 0, y = 0;
		if (node) {
			if (node.getBoundingClientRect) {
				var box = node.getBoundingClientRect(),
					pos = _getScrollPos(self.doc);
				x = box.left + pos.x;
				y = box.top + pos.y;/*此top为负数*/
			} else {
				while (node) {
					x += node.offsetLeft;
					y += node.offsetTop;
					node = node.offsetParent;
				}
			}
		}
		return {x : _round(x), y : _round(y)};
	},

没有找到特别好的解决方案,临时解决一下。
这样滚动条就无法自动滚动了,尽管不完美,但比滚动条总往上顶强。
ps:如果不使用 br 换行完全不会产生这个bug

解决代码如下:

	pos : function() {
		var self = this, node = self[0], x = 0, y = 0;
		if (node) {
			if (node.getBoundingClientRect) {
				var box = node.getBoundingClientRect(),
					pos = _getScrollPos(self.doc);
				x = box.left + pos.x;
				//y = box.top + pos.y;
				//临时解决方案 针对  newlineTag: 'br',
				y = pos.y;
			} else {
				while (node) {
					x += node.offsetLeft;
					y += node.offsetTop;
					node = node.offsetParent;
				}
			}
		}
		return {x : _round(x), y : _round(y)};
	},

Kindeditor 远程图片本地化 PHP

首先KindEditor这个编辑器带有远程图片上传功能
 但是因为远程图片肯定会有失效的一天
所以我想能不能在提交的同时将KindEditor编辑框内的所有远程图片本地化在调用 而不是调用远程图片
设提交数据获取到 $htmlData = $_POST[“content1”];
则有

$htmlData = $_POST["content1"];
preg_match_all("/<.+?>/s", strip_tags($htmlData, "<img>"), $r); //获取全部 img 标记作为替换本地文件时的依据
foreach($r[0] as $i=>$f) {
  preg_match("/src="([^"]+)"/i", $f, $u); //获取远程图片的url
  $s = file_get_contents($u[0]); //读取远程图片
  $fn = "按你自己规则产生的文件名";
  file_put_contents($fn, $s); //写入本地
  $t[$i] = "配好的url的文件名";
}
$htmlData = str_replace($r[0], $t, $htmlData); //替换回文档

kindeditor 修改上传图片的路径的方法

默认情况下kindeditor上传的图片在编辑器的根目录/attached/目录下。以日期建一个目录,然后保存文件。有些时候大概我们并不想这样。考虑到更新编辑器,或更换编辑器不太方便。比如我现在想把上传的文件保存在根目录下的uploadfiles目录下,需要修改以下代码:

首先,打开文件php\upload_json.php,在大约第16行到第19行,定义了文件保存目录路径和文件保存目录URL,我们需要修改为:
//文件保存目录路径
$save_path = $_SERVER[‘DOCUMENT_ROOT’].’\\uploadfiles\\’;

//文件保存目录URL
 $save_url = ‘/uploadfiles/’;

解释一下:$save_path 即为最后保存文件的目录。这里就是根目录下的uploadfiles
$save_url 即为上传成功后,图片的URL地址。

这样,保存地址就变成了 根目录下的 uploadfiles/年月日/xxxxx.jpg了。