ie8&chrome_javascript 기술에서 창 크기 조정 이벤트가 여러 번 실행되는 문제를 수정했습니다.

WBOY
풀어 주다: 2016-05-16 18:00:43
원래의
1445명이 탐색했습니다.
코드 복사 코드는 다음과 같습니다.

/**
* window.onresize 이벤트 전용 이벤트 바인더 v0.1 Alucelx
* http://www.cnblogs.com/Alucelx/archive/2011/10/20/2219263.html
* <
* lte ie8 및 chrome 및 기타 상황에서 기본 window.resize 이벤트가 여러 번 실행될 수 있는 버그를 해결하는 데 사용됩니다.
* * 추가: 이벤트 핸들러 추가
* 제거: 이벤트 핸들러 삭제
* */
var onWindowResize = function(){
//이벤트 큐
var queue = [],
indexOf = Array.prototype.indexOf || function(){
var i = 0, length = this. length;
for( ; i if(this[i] === 인수[0]){
return i; >return - 1;
};
var isResizing = {}, //lte ie8/chrome에서 window.onresize 이벤트가 여러 번 실행되는 버그를 제거하는 데 사용됩니다. 🎜>lazy = true, / /Lazy 실행 표시
listener = function(e){ //이벤트 리스너
var h = window.innerHeight || (document.documentElement && document.documentElement.clientHeight) || .body.clientHeight,
w = window.innerWidth || (document.documentElement && document.documentElement.clientWidth) || document.body.clientWidth
if( h === isResizing.h && w == = isResizing.w){
return;
}else{
e = e || window.event;
var i = 0, len = queue.length; < len; i ) {
queue[i].call(this, e)
}
isResizing.h = h,
isResizing.w = w; >}
return {
add: function(fn){
if(typeof fn === 'function'){
if(lazy){ //지연 실행
if(window .addEventListener){
window.addEventListener('resize', 청취자, false);
}else{
window.attachEvent('onresize', 청취자)
}
lazy = false ;
}
queue.push(fn);
}else{ }
return this
},
remove: function(fn){
if(typeof fn; === '정의되지 않음' ){
queue = [];
}else if(typeof fn === 'function'){
var i = indexOf.call(queue, fn); >if(i > -1){
queue.splice(i, 1)
}
}
이것을 반환합니다.
}
}; call(this);


창 크기 조정 이벤트를 바인딩하려면 이 객체를 사용하세요
예:




코드 복사


코드는 다음과 같습니다.

var _fn = function(){document.body.innerHTML = "1"};
onWindowResize.add(_fn)
.add(function(){document .body.innerHTML = "2"})
.add(function(){document.body.innerHTML = "3"}) .remove(_fn); >
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿