决策报表中有多个报表块,通过js实现跑马灯自动循环滚动效果,但是只一个报表块实现了功能。

2个报表块:report_左下,report_中下。js代码相似,其中一个实现了效果,另外一个没有,求教什么原因?

image.png

1、报表块:“report_中下”实现了效果,其事件--初始化后--js代码:

setTimeout(function() {

//隐藏报表块的滚动条 

    //获取报表块宽度

    var wid = ($("div[widgetname='REPORT_中下']").width() - 17) + 'px';

    //重置报表块宽度

    $("div[widgetname='REPORT_中下']").css('width', wid);

    //获取报表块高度

    var height = ($("div[widgetname='REPORT_中下']").height() - 16) + 'px';

    //重置报表块高度

    $("div[widgetname='REPORT_中下']").css('height', height);

}, 1000);

//鼠标悬停,滚动停止  

window.flag=true;

setTimeout(function(){   

$("#frozen-center").mouseover(function()  

{  

  window.flag=false;  

  })

//鼠标离开,继续滚动  

$("#frozen-center").mouseleave(function()  

{  

  window.flag=true; 

  })  

//以200ms的速度每次滚动1.5PX  

var old=-1;   

var interval=setInterval(function()  

{

if(window.flag){

   currentpos=$("#frozen-center")[0].scrollTop;  

   if (currentpos==old){

   $("#frozen-center")[0].scrollTop=0;

     }  

   else {  

      old=currentpos;  

      $("#frozen-center")[0].scrollTop=currentpos+1.5;  

        }  

      }

    },200);

},3000)

2、报表块:“report_左下”不行,其事件--初始化后--js代码:

setTimeout(function() {

//隐藏报表块的滚动条 

    //获取报表块宽度

    var wid = ($("div[widgetname='REPORT_左下']").width() - 17) + 'px';

    //重置报表块宽度

    $("div[widgetname='REPORT_左下']").css('width', wid);

    //获取报表块高度

    var height = ($("div[widgetname='REPORT_左下']").height() - 16) + 'px';

    //重置报表块高度

    $("div[widgetname='REPORT_左下']").css('height', height);

}, 1000);

//鼠标悬停,滚动停止  

window.flag=true;

setTimeout(function(){   

$("#frozen-center").mouseover(function()  

{  

  window.flag=false;  

  })

//鼠标离开,继续滚动  

$("#frozen-center").mouseleave(function()  

{  

  window.flag=true; 

  })  

//以40ms的速度每次滚动1.5PX  

var old=-1;   

var interval=setInterval(function()  

{

if(window.flag){

   currentpos=$("#frozen-center")[0].scrollTop;  

   if (currentpos==old){

   $("#frozen-center")[0].scrollTop=0;

     }  

   else {  

      old=currentpos;  

      $("#frozen-center")[0].scrollTop=currentpos+1.5;  

        }  

      }

    },40);

},3000)

FineReport jieujieu 发布于 2021-12-30 23:19 (编辑于 2021-12-30 23:23)
1min目标场景问卷 立即参与
回答问题
悬赏:3 F币 + 添加悬赏
提示:增加悬赏、完善问题、追问等操作,可使您的问题被置顶,并向所有关注者发送通知
共2回答
最佳回答
1
shirokoLv6资深互助
发布于2021-12-31 01:48

因为你抄的这个代码就没有考虑多个报表块的情况。

看看这个吧

https://help.fanruan.com/finereport10.0/doc-view-2393.html

  • jieujieu jieujieu(提问者) 谢谢,你提供的链接,里面写的有点复杂,能否直接告知,js代码里面是哪个地方还需要修改?
    2021-12-31 12:00 
  • shiroko shiroko 回复 jieujieu(提问者) 你看你的代码里面,$(\".frozen-center\"),他那里是$(\"div[widgetname=REPORT0]\").find(\".frozen-center\")。他是指定了报表块的,也就是说你的代码里因为只有一个报表块就没考虑去指定报表块了。而他的代码里是指定的。
    2021-12-31 12:18 
  • jieujieu jieujieu(提问者) 回复 shiroko 第2个报表块js改成了以下代码,实现了自动滚动的效果,但是鼠标移上不会停止滚动,是不是跟window.flag1的序号有关系?尝试改了几个序号没有起到效果,如果跟flag1序号有关系,那么怎么获取这个序号值呢? setTimeout(function() { //隐藏报表块的滚动条 //获取报表块宽度 var wid = ($(\"div[widgetname=\'REPORT_左下\']\").width() - 17) + \'px\'; //重置报表块宽度 $(\"div[widgetname=\'REPORT_左下\']\").css(\'width\', wid); //获取报表块高度 var height = ($(\"div[widgetname=\'REPORT_左下\']\").height() - 16) + \'px\'; //重置报表块高度 $(\"div[widgetname=\'REPORT_左下\']\").css(\'height\', height); }, 1000); window.flag1=true; var self1 = this; //鼠标悬停,滚动停止 setTimeout(function() { $(\"div[widgetname=\'REPORT_左下\']\").find(\"#frozen-center\").mouseover(function() { window.flag1 = false; }); //鼠标离开,继续滚动 $(\"div[widgetname=\'REPORT_左下\']\").find(\"#frozen-center\").mouseleave(function() { window.flag1 = true; }); var old = -1; window.interval = setInterval(function() { if (!self1.isVisible()) { return; } if (window.flag1) { currentpos1 = $(\"div[widgetname=\'REPORT_左下\']\").find(\"#frozen-center\")[0].scrollTop; if (currentpos1 == old && 0!=currentpos1) { $(\"div[widgetname=\'REPORT_左下\']\").find(\"#frozen-center\")[0].scrollTop = 0; } else { old = currentpos1; //以25ms的速度每次滚动1.5PX $(\"div[widgetname=\'REPORT_左下\']\").find(\"#frozen-center\")[0].scrollTop = currentpos1 + 1.5; } } }, 25); }, 1000);
    2022-01-03 15:07 
  • shiroko shiroko 回复 jieujieu(提问者) 每个报表块的flag起一个独立的名字
    2022-01-03 15:39 
  • jieujieu jieujieu(提问者) 回复 shiroko 谢谢,在哪里起名字?代码里面是已经了不同的序号了
    2022-01-03 15:43 
最佳回答
1
snrtuemcLv8专家互助
发布于2021-12-31 07:49

多报表块滚动,报表块名称需要大写,报表块需要设置冻结,每个报表块可以拷贝代码,但是注意修改报表块名

setTimeout(function() {

    //隐藏报表块REPORT0的滚动条(此报表块名为REPORT0,根据具体情况修改)

    $("div[widgetname=REPORT0]").find(".frozen-north")[0].style.overflow = "hidden";

    $("div[widgetname=REPORT0]").find(".frozen-center")[0].style.overflow = "hidden";

}, 1000);

window.flag = true;

//鼠标悬停,滚动停止  

setTimeout(function() {

    $(".frozen-center").mouseover(function() {

        window.flag = false;

    });

    //鼠标离开,继续滚动  

    $(".frozen-center").mouseleave(function() {

        window.flag = true;

    });

    var old = -1;

    var interval = setInterval(function() {

        if(window.flag) {

            currentpos = $("div[widgetname=REPORT0]").find(".frozen-center")[0].scrollTop;

            if(currentpos == old) {

                $("div[widgetname=REPORT0]").find(".frozen-center")[0].scrollTop = 0;

            } else {

                old = currentpos;

                //以25ms的速度每次滚动1.5PX  

                $("div[widgetname=REPORT0]").find(".frozen-center")[0].scrollTop = currentpos + 1.5;

            }

        }

    }, 25);

}, 1000);

  • jieujieu jieujieu(提问者) 报表名大写,这个已经考虑了。应该是多报表块的问题,但是具体不知道怎么弄?
    2021-12-31 11:57 
  • 3关注人数
  • 517浏览人数
  • 最后回答于:2021-12-31 07:49
    请选择关闭问题的原因
    确定 取消
    返回顶部