kindeditor编辑器点中图片滚动条往上顶的bug

比如现在我插入两张图片，

无论我点击哪张图片，里边的滚动条都会往上顶。

本来以为往上会有解决方法，一查结果没有；然后想着去官网查查，然而什么都没有，想到官网提交这个bug，结果没地方提交。

怎么解决，如果单是解决这个bug，去研究源码，我觉的是吃力不讨好的。

然后我就直接从 click、mousedown 这两个事件找起，找它们获得高度的地方，然后 感觉是的话就console.log下，看是不是。然后就找到了。

在这个函数里

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;
} else {
while (node) {
x += node.offsetLeft;
y += node.offsetTop;
node = node.offsetParent;
}
}
}
return {x : _round(x), y : _round(y)};
},

主要就是 那个box.top这里，不知道为什么，其他调用的时候都没问题，就是点击图片的时候它就变成负数，估计它是获得img的距离document的高度，而不是当前鼠标点击的地方距离document的高度，或者其他。

所以我就在得到y之前去判断box.top是否>0，然后将其等于0。然而并没有效果。即：box.top= box.top<0 ? 0 : box.top;

不行我就直接在y=box.top + pos.y 这改， y = (parseInt(box.top) < 0 ? 0 : box.top) +pos.y;

这个bug解决了，但不知道哪里会出现问题。所以 改的时候 请多测测。反正 我是没找到有问题的地方，有的话，记得提醒哦。谢谢。

以上所述就是本文的全部内容了，希望能给有相同需求的小伙伴们一些帮助。

赞 (0)

相关推荐

  • jQuery读取和设定KindEditor值的方法

    jQuery读取和设定KindEditor值的方法

    在使用Kindeditor的时候,想要利用Ajax传值,但是通过editor封装的方法是行不通的,原因在于编辑器我们是放在另一个jsp页面,通过iframe来加载的,同时这个iframe的display="none"的,要通过一个事件来触发. 复制代码 代码如下: <iframe src="../common/editor.jsp" frameborder="0" scrolling="no" style="m

  • 使用JavaScript为Kindeditor自定义按钮增加Audio标签

    流程比较简单,主要有以下步骤: 注册插件(按钮.Lang.htmlTags.插件脚本) 基于media插件代码修改 注册插件 首先,全局配置kindeditor参数: KindEditor.lang({ audio : 'MP3' }); KindEditor.options.htmlTags['audio'] = ['src','controls','autoplay','type']; KindEditor.options.htmlTags['source'] = ['src','contr

  • kindeditor修复会替换script内容的问题

    kindeditor一些个人修改 1.替换script里面的内容的问题 2.颜色选择器扩展,复制的fck编辑器选颜色 3.swfupload.swf上传前图片预览功能 kindeditor.js function _formatHtml(html, htmlTags, urlType, wellFormatted, indentChar) { if (html == null) { html = ''; } //2015-03-25 html = html.replace(/textarea__

  • jQuery编辑器KindEditor4.1.4代码高亮显示设置教程

    编辑器KindEditor官网: http://www.kindsoft.net/ 1.需要加载的JS和CSS文件为: 复制代码 代码如下: <script src="kindeditor-4.1.4/kindeditor.js" type="text/javascript" charset="utf-8"></script> <script src="kindeditor-4.1.4/plugins/co

  • Angularjs编写KindEditor,UEidtor,jQuery指令

    目前angularJS非常火热,本人也在项目中逐渐使用该技术,在angularJS中,指令可以说是当中非常重要的一部分,这里分享一些自己编写的指令: 注:本人项目中用了oclazyload进行部分JS文件加载 1.KindEditor 复制代码 代码如下: angular.module('AdminApp').directive('uiKindeditor', ['uiLoad', function (uiLoad) {     return {         restrict: 'EA',

  • KindEditor图片上传的Asp.net代码实例

    复制代码 代码如下: using System;using System.Globalization;using System.Collections;using System.Configuration;using System.Data;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.HtmlControls;using System.Web.UI.WebControls;u

  • 对GridView的行加颜色并弹出Kindeditor的实现思路

    前台代码: 复制代码 代码如下: <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script type="text/javascript"> function tureDelete() { if (c

  • dotnet封装的kindeditor编辑器控件

    KindEditor很不错,刚接触不久,非常喜欢.KindEditor网站有ForPHP等扩展的,没有ForNet的.我是搞.net开发的,就用它简单封装了一个控件,拖过来即可使用,使用更加简单.源码提供给大家,有兴趣的朋友可以进一步完善. 1.第一次使用,需要配置一下web.config. 复制代码 代码如下: <configSections><section name="KindEditor" type="KindEditorForDotNet.Conf

  • ASP.NET网站使用Kindeditor富文本编辑器配置步骤

    ASP.NET网站使用Kindeditor富文本编辑器配置步骤

    1. 下载编辑器 下载 KindEditor 最新版本,下载页面: http://www.kindsoft.net/down.php 2. 部署编辑器 解压 kindeditor-x.x.x.zip 文件,将editor文件夹复制到web目录下  3.在网页中加入(ValidateRequest="false") 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" Validat

  • nodejs 整合kindEditor实现图片上传

    kindEditor官网上中提供了ASP,ASP.NET,JSP相关的整合应用,http://kindeditor.net/docs/upload.html可以参照实现nodejs的整合,发现实用nodejs更简单 环境: unbuntu 14.10 nodejs 0.10.35 express 4.11.2 formidable 1.0.16 kindEditor 4.1.10 webStorm 8 1.通过IDE或终端创建一个名称为test的工程 2.编辑package.json添加form

随机推荐