javascript - 显示jqGrid滚动条的当前位置

标签 javascript jquery jqgrid

目前我正在开发一个迷你 jqGrid 项目。该项目的最后一个要求是,每当我更改滚动条的位置时,都应该触发一个事件,该事件应该在控制台上打印滚动条的当前位置。但每次我在控制台上都会得到相同的响应。

function filljQgrid(para1,para2){
    var a;
    var rowData;
    var pos;
    var scrollLength;
    var gridData=para1;
    var entityId=para2;
    jQuery('#list').jqGrid('clearGridData');
    var elementTop;
    var elementBottom;
    var viewportTop;
    var viewportBottom;
    jQuery(document).ready(function(){
        var grid_selector="#list";
        var pager_selector="#page";
        //responsive starts
        var parent_column = $(grid_selector).closest('[class*="col-"]');
        //resize to fit page size
        $(window).on('resize.jqGrid', function () {
            $(grid_selector).jqGrid( 'setGridWidth', parent_column.width() );
                 })
        $(document).on('settings.ace.jqGrid' , function(ev, event_name, collapsed) {
        if( event_name === 'sidebar_collapsed' || event_name === 'main_container_fixed' ) {
        setTimeout(function() {
            $(grid_selector).jqGrid( 'setGridWidth', parent_column.width() );
            }, 20);
            }
           })
    jQuery("#list").jqGrid({
            datatype:"local",
            width:"1090",
            height:"50",
            colNames:["ENTITY ID","RANK","ACCOUNT NAME","BENIFIT VALUE"],
            colModel:[
                        {name:"entity_id",index:"entity_id",sortable:false,width:90,align:"center",key:true,hidden:true},
                        {name:"rank",index:"rank",sortable:true,sorttype:"int",width:90,align:"center"},
                        {name:"account_name",index:"account_name",width:90,sortable:false,align:"center"},
                        {name:"incentive",index:"incentive",width:90,sortable:false,align:"center"}

                     ],
            viewrecords:true,
            ignoreCase:true,
            scrollrows:true,
            altRows:true,
            });
            $(window).triggerHandler('resize.jqGrid');
            for(var l=0;l<gridData.length;l++)
                {
                jQuery("#list").jqGrid('addRowData', l+1, gridData[l]);
                }
            $("#list").setGridParam({sortname:'rank', sortorder: 'asc', loadComplete:function(){
                                                                                    jQuery('#list').jqGrid('setSelection','50147');
                                                                                    jQuery('#list').find('.ui-state-highlight').css('background', '#0487BD');
                                                                                    jQuery('#list').find('.ui-state-highlight').css('color', 'white');
                                                                                    a=jQuery('#list').jqGrid('getGridParam',"selrow");
                                                                                    rowData = jQuery('#list').jqGrid ('getRowData',a);in json format
                                                                                    pos=jQuery("#list").closest(".ui-jqgrid-bdiv").scrollTop();
                                                                                    elementTop = jQuery("#list").closest(".ui-jqgrid-bdiv").offset().top;
                                                                                    elementBottom = elementTop + $('a').height();
                                                                                    viewportTop = $("#list").scrollTop();
                                                                                    viewportBottom = viewportTop + $("#list").height();


                                                                                               }
                                    }).trigger('reloadGrid');
            //adding search begins here           
            jQuery("#list").jqGrid('navGrid','#ptoolbar',{del:false,add:false,edit:false,search:false});
            jQuery("#list").jqGrid('filterToolbar',{stringResult: true,searchOnEnter : false});
            //adding search ends here
            //if($('a').is(':visible')){}
            $(".ui-jqgrid-bdiv").scroll(function(){console.log(elementTop)});

        });**strong text**
    }//closing brace for filljQgrid()

最佳答案

网格创建后可以绑定(bind)滚动事件并查看位置 尝试使用此代码

var mygrid = $("#jqGrid")[0];
$(mygrid.grid.bDiv).scroll(function(e){
    console.log(this.scrollTop);
});

关于javascript - 显示jqGrid滚动条的当前位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51155058/

相关文章:

javascript - 在 ExtJS 中使用函数

jquery - jquery中鼠标悬停时获取元素的id

jquery - 在jqgrid的列中添加图像

javascript - 将 Angular Directive(指令)模板绑定(bind)到事件

javascript - 等待外部ajax请求时显示动画

javascript - 由于使用 onClick 的文本区域的数据空间,Bootstrap Modal 上的数据未显示

jquery - JqG​​rid需要超链接-需要通过Jquery捕获值

javascript - jqGrid格式化程序修改原始数据?

javascript - JQuery 只获取元素的文本而不是子元素的文本

javascript - javascript函数的编排