javascript – 用于用户协议视图的AngularJS指令,检测启用按钮,不适用于移动Safari

前端之家收集整理的这篇文章主要介绍了javascript – 用于用户协议视图的AngularJS指令,检测启用按钮,不适用于移动Safari前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个用户协议屏幕.基本上是带有iframe和按钮的 HTML视图.当用户滚动到底部时,我想启用该按钮.这适用于所有桌面浏览器,IE,Chrome,Safari,但不适用于移动Safari或ios设备上的chrome.似乎“滚动”事件没有正确连接.你会看到有什么可以做这件事吗?
(function() {
  angular.module('myapp').directive('textAgreement',function($timeout,ActivityLogService) {
    return {
      restrict: 'A',scope: {
        onscrollCallback: '&onscrollCallback',onloadCallback: '&onloadCallback'
      },compile: function(tElement) {        
        return function(scope,element) {
          /** Called on load **/
          var appliedCheck = function(event) {
            try {
              if (typeof scope.onloadCallback !== undefined) {
                if (typeof scope.onloadCallback == 'function') {                      
                  scope.onloadCallback();  
                  scope.$apply();
                }
              } 
              var elm = element[0].contentWindow.document.body;
              var newwin = element[0].contentWindow;            
              if (elm) {
                $(newwin).scroll(function() {
                  var checkBottom = (elm.scrollTop+600) >= elm.scrollHeight;
                  console.log('###$$$+++++ ' + elm.scrollTop +  ' ' + elm.scrollHeight);                                   
                  if (checkBottom) {        
                    scope.bottom = true;
                    if (typeof scope.onscrollCallback !== undefined) {
                      if (typeof scope.onscrollCallback == 'function') {                      
                        scope.onscrollCallback();  
                        scope.$apply();
                      }
                    }                  
                  }
                });                
              }
            } catch(e) {
              console.log(e);              
            }
          }; 
          element.bind('load',appliedCheck);                                    
        }; 
      }    
    };
  });   
})();

            <iframe text-agreement onload-callback="disableLoading()" onscroll-callback="enableAgree()" id="agreeFrame" src="{{ ::trustSrcAgreementUri }}" style="border:0" width="100%" height="100%"></iframe>

解决方法

滚动事件在桌面上的移动设备上不起作用.实质上,滚动事件只在滚动结束时触发.见:

http://andyshora.com/mobile-scroll-event-problems.html

猜你在找的JavaScript相关文章