首頁 web前端 js教程 IE之动态添加DOM节点触发window.resize事件_javascript技巧

IE之动态添加DOM节点触发window.resize事件_javascript技巧

May 16, 2016 pm 06:22 PM
dom 事件

然后页面有几个事件是动态地增加DOM元素的,比如点击某个层会在底下列出该层详细内容,这样在FF和chrome下没出现问题,但是在IE6-8下每次都重布局了.

比如我拖动一个层,在拖动过程中层的内容又显示在最底下了,当我放开层的时候这个层就跳回拖动前的位置了...

起先我还没看出来是重布局了...然后演示了N久,挣扎了N久,终于觉得可能是由于动态增加DOM节点导致触发window.resize而使页面重布局了...

最后我不由地在心里喊了句"Thank godness....",还好改变窗口的高度对页面布局没有影响,不然真要麻烦死了...

复制代码 代码如下:

bindResizeWindow:function(){
var obj = this;
$(window).resize(function(){
var newWidth = $(window).width();
if(newWidth == obj.windowWidth){return;}
obj.initUI();
obj.createUI();
obj.windowWidth = newWidth;
});
},


只要在绑定方法中判只有宽度改变时才触发重布局事件就行了...
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

事件 ID 4660:已刪除物件 [修復] 事件 ID 4660:已刪除物件 [修復] Jul 03, 2023 am 08:13 AM

我們的一些讀者遇到了事件ID4660。他們通常不確定該怎麼做,所以我們在本指南中解釋。刪除物件時通常會記錄事件ID4660,因此我們還將探索一些實用的方法在您的電腦上修復它。什麼是事件ID4660?事件ID4660與活動目錄中的物件相關,將由下列任一因素觸發:物件刪除–每當從ActiveDirectory中刪除物件時,都會記錄事件ID為4660的安全事件。手動變更–當使用者或管理員手動變更物件的權限時,可能會產生事件ID4660。變更權限設定、修改存取等級或新增或刪除人員或群組時,可能會發生這種情

在iPhone鎖定畫面上取得即將到來的日曆事件 在iPhone鎖定畫面上取得即將到來的日曆事件 Dec 01, 2023 pm 02:21 PM

在運行iOS16或更高版本的iPhone上,您可以直接在鎖定畫面上顯示即將到來的日曆事件。繼續閱讀以了解它是如何完成的。由於錶盤複雜功能,許多AppleWatch用戶習慣能夠看一眼手腕來查看下一個即將到來的日曆事件。隨著iOS16和鎖定螢幕小部件的出現,您可以直接在iPhone上查看相同的日曆事件訊息,甚至無需解鎖設備。日曆鎖定螢幕小元件有兩種風格,可讓您追蹤下一個即將發生的事件的時間,或使用更大的小元件來顯示事件名稱及其時間。若要開始新增小元件,請使用面容ID或觸控ID解鎖iPhone,長按

在JavaScript中,'oninput'事件的用途是什麼? 在JavaScript中,'oninput'事件的用途是什麼? Aug 26, 2023 pm 03:17 PM

當輸入框中新增值時,就會發生oninput事件。您可以嘗試執行以下程式碼來了解如何在JavaScript中實現oninput事件-範例<!DOCTYPEhtml><html>  <body>   <p>Writebelow:</p>   <inputtype="text&quot

vue dom是什麼意思啊 vue dom是什麼意思啊 Dec 20, 2022 pm 08:41 PM

dom是一種文件物件模型,同時也是用於html程式設計的接口,透過dom來操作頁面中的元素。 DOM是HTML文件的記憶體中物件表示,它提供了使用JavaScript與網頁互動的方式。 DOM是節點的層次結構(或樹),其中document節點為根。

vue3中ref綁定dom或元件失敗的原因為何及怎麼解決 vue3中ref綁定dom或元件失敗的原因為何及怎麼解決 May 12, 2023 pm 01:28 PM

vue3ref綁定dom或元件失敗原因分析場景描述在vue3中常用到使用ref綁定元件或dom元素的情況,很多時候,明明使用ref綁定了相關元件,但是經常ref綁定失敗的情況。 ref綁定失敗情況舉例ref綁定失敗的絕大多數情況是,在ref和元件綁定的時候,該元件還未渲染,所以綁定失敗。或是元件剛開始未渲染,ref未綁定,當元件開始渲染,ref也開始綁定,但是ref和元件並未綁定完成,這個時候使用元件相關的方法就會出現問題。 ref綁定的元件使用了v-if,或他的父元件使用了v-if導致頁面

jQuery中如何實作select元素的改變事件綁定 jQuery中如何實作select元素的改變事件綁定 Feb 23, 2024 pm 01:12 PM

jQuery是一個受歡迎的JavaScript函式庫,可以用來簡化DOM操作、事件處理、動畫效果等。在web開發中,常常會遇到需要對select元素進行改變事件綁定的情況。本文將介紹如何使用jQuery實作對select元素改變事件的綁定,並提供具體的程式碼範例。首先,我們需要使用標籤來建立一個包含選項的下拉式選單:

Vue3取得DOM節點的方式有哪些 Vue3取得DOM節點的方式有哪些 May 11, 2023 pm 04:55 PM

1.原生js取得DOM節點:document.querySelector(選擇器)document.getElementById(id選擇器)document.getElementsByClassName(class選擇器)....2.vue2中取得目前元件的實例物件:因為每個vue的元件實例上,都包含一個$refs對象,裡面儲存著對應的DOM元素或元件的參考。所以在預設情況下,元件的$refs指向一個空物件。可以先在元件上加上ref="名字",然後透過this.$refs.

jquery中常用的事件有哪些 jquery中常用的事件有哪些 Jan 03, 2023 pm 06:13 PM

jquery中常用的事件有:1、window事件;2、滑鼠事件,是當使用者在文件上方移動或點選滑鼠時而產生的事件,包括滑鼠點選、移入事件、移出事件等;3、鍵盤事件,是使用者每次按下或釋放鍵盤上的按鍵時都會產生事件,包括按下按鍵事件、釋放按鍵按鍵等;4、表單事件,例如當元素獲得焦點時會觸發focus()事件,失去焦點時會觸發blur()事件,表單提交時會觸發submit()事件。

See all articles