ホームページ > ウェブフロントエンド > jsチュートリアル > ie8&chrome_javascript スキルでのウィンドウ サイズ変更イベントの複数実行を修正

ie8&chrome_javascript スキルでのウィンドウ サイズ変更イベントの複数実行を修正

WBOY
リリース: 2016-05-16 18:00:43
オリジナル
1475 人が閲覧しました
コードをコピー コードは次のとおりです:

/**
* window.onresize イベント専用イベント バインダー v0.1 Alucelx
* http://www.cnblogs.com/Alucelx/archive/2011/10/20/2219263.html
* <
* lte ie8 や chrome などの状況でネイティブの window.resize イベントが複数回実行される可能性があるバグを解決するために使用されます。 * add: イベント ハンドラーを追加
* delete: イベント ハンドラーを削除
* */
var onWindowResize = function (){
//Event queue
var queue = [],
indexOf = Array.prototype.indexOf || function(){
var i = 0, length = this.長さ;
for( ; i < length; i ){
if(this[i] === 引数[0]){
return i;
}
return - 1;
};
var isResizing = {}, //lte ie8/chrome の window.onresize イベントの複数実行のバグを排除するために使用されます。 🎜>lazy = true, / /遅延実行 mark
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 ||
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 までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート