easyui 操作列固定在右侧，其余列可横向滚动

1、页面css添加下面代码。

.datagrid-view1 {
    left: auto;
    right: 0;
}
.datagrid-view2 {
    left: 0;
    right: auto;
}
.datagrid-view2 .datagrid-body {
    padding-right: 21px;
}

2、在datagrid的onLoadSuccess方法内执行以下js即可实现。

$(".datagrid-view1 .datagrid-body").css("overflow-y", "auto");
var timer1 = null;
var timer2 = null;
function a() {
    $(".datagrid-view1 .datagrid-body").scroll(function () {
        clearTimeout(timer1);
        // 解除滚动监听事件，否则两个滚动条一起监听，会导致互相影响
        $(".datagrid-view2 .datagrid-body").unbind("scroll");
        // 禁止另外一个滚动条滚动，只有在下面定时器绑定事件后才允许滚动
        $(".datagrid-view2 .datagrid-body").on('scroll mousewheel touchmove', function (e) {
            e.preventDefault();
            e.stopPropagation();
            return false;
        });
        $(".datagrid-view2 .datagrid-body").scrollTop($(".datagrid-view1 .datagrid-body").scrollTop());
        timer1 = setTimeout(function () {
            $(".datagrid-view2 .datagrid-body").unbind('scroll mousewheel touchmove');
            b();
        }, 1000);
    });
}
function b() {
    $(".datagrid-view2 .datagrid-body").scroll(function () {
        clearTimeout(timer2);
        $(".datagrid-view1 .datagrid-body").unbind("scroll");
        $(".datagrid-view1 .datagrid-body").on('scroll mousewheel touchmove', function (e) {
            e.preventDefault();
            e.stopPropagation();
            return false;
        });
        $(".datagrid-view1 .datagrid-body").scrollTop($(".datagrid-view2 .datagrid-body").scrollTop());
        timer2 = setTimeout(function () {
            $(".datagrid-view1 .datagrid-body").unbind('scroll mousewheel touchmove');
            a();
        }, 1000);
    });
}
a();
b();

标签：function,body,滚动,view1,easyui,列可,view2,datagrid,scroll
来源： https://www.cnblogs.com/hpwlym/p/12737743.html