【问题标题】:Detect scroll events with bootstrap-modal modalOverflow?使用引导模式modalOverflow检测滚动事件?
【发布时间】:2013-09-18 22:15:31
【问题描述】:

我的模式中有许多工具提示和日期选择器。如何检测溢出模态是否已滚动,以便我可以重新定位任何打开的浮动元素并根据模态滚动位置重新定位它们? 谢谢

window.scroll 没有触发!

这里有一个例子:长模式(页面底部) http://jschr.github.io/bootstrap-modal/

【问题讨论】:

    标签: javascript jquery html css twitter-bootstrap


    【解决方案1】:

    好的,我整理好了。 滚动事件不会传播到 DOM 的文档级别,因此 $(document).on 不起作用。 我用这个 hack 解决了这个问题。

    确实工作了。

    $(document).on("shown", "#modalcontact", function() {
        $(".modal-scrollable").unbind("scroll");
        $(".modal-scrollable").scroll(function(){
            //do stuff
        });
    });
    

    没有工作。

    $("#modalcontact").modal({
        shown: function (){
            $(".modal-scrollable").scroll(function(){
                //do stuff
            });     
        }
    });
    

    没有工作。

    $(document).on("scroll", ".modal-scrollable", function(){
        //do stuff
    });
    

    【讨论】:

    • 你在哪个元素上设置了 modal-scrollable 类?
    【解决方案2】:

    你已经回答了你自己的问题,但我想补充一点,它也是这样工作的:

    $("#modalcontact").modal().on('loaded.bs.modal', function(){
       $(this).parents('.modal-scrollable').scroll(function(){
          //Do stuff
       });
    });
    

    我一直在努力处理显示的事件,但这是因为内容是远程加载的。

    【讨论】:

      【解决方案3】:

      试试

      $(document).on('scroll', '.modal-scrollable', function(){
      //your code here
      });
      

      滚动事件处理程序不仅可以绑定到窗口。

      【讨论】:

      • 没什么 :( 真的让我发疯了
      【解决方案4】:

      这对我有用,而早期的答案由于某种原因没有。但是我正在使用代码打开模态窗口,这样我就可以在显示之前用内容动态填充它。

       $('#modalcontact').modal('show');
      
       $(".modal-scrollable").unbind("scroll");
       $(".modal-scrollable").scroll(function () {
          $('body').append('Hey hey hey!');
       });
      

      【讨论】:

        猜你喜欢
        • 2020-10-03
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2017-05-02
        • 1970-01-01
        • 1970-01-01
        • 2012-04-11
        • 1970-01-01
        相关资源
        最近更新 更多