jcrop的bug

1 360(7.1.1.620,内核:31.0.1650.63)的极速模式下,出现裁剪框后,鼠标点击,页面就会滑动到底部。

查看了下源码,发现是下面的代码:

function watchKeys() //{{{
      {
        if (options.keySupport) {
          $keymgr.show();
          $keymgr.focus();
        }
      }

触发focus的时候,就会滑动到页面底部。

具体原因是:$keymgr对象就是一个位于页面底部的隐藏的input对象,所以,focus的时候,页面就会滑动到底部。

解决方法:可通过把keySupport设置为false,来避免触发该input对象的focus事件。

我实例化的代码如下所示:

var jcropObj = {};
$('#jcrop_div_id').Jcrop({
    onChange : this.showPreview,
    onSelect : this.showPreview,
    aspectRatio : 1,
    /*
     * 下面的参数,防止360(7.1.1.620,内核:31.0.1650.63)的极速模式下,鼠标点击后,会滑动到页面底部的bug。
     * 具体 就是,keySupport默认为true,在源码中有watchKeys函数的$keymgr.focus()代码。
     * 因为jcrop-holder的div下有一个位于页面底部的隐藏的input,当鼠标点击的时候,该input就会focus,所以页面就会滑动到底部了。
     */
    keySupport : false
}, function() {
    //获取jcrop对象,以便保存成功之后的相关操作
    jcropObj.jcropDistance_v1 = this;

    //初始 选框的位置和大小(创建选框,参数格式为:[x, y, x2, y2])//165=210/2+60  110=180/2+20
    jcropObj.jcropDistance_v1.setSelect([60, 20, 165, 110]);
});
原文地址:https://www.cnblogs.com/simonbaker/p/4873819.html