搜尋
首頁web前端js教程img onload事件綁定各瀏覽器皆可執行_基礎知識

在需要對img進行onload事件綁定的時候,一般大家都會想到用常規的方法進行事件綁定,如下:

複製程式碼 代碼如下:





img onload事件綁定(錯誤用法)



img onload事件綁定各瀏覽器皆可執行_基礎知識
body>


此時大家會發現alert(1)並沒有執行,這是什麼原因呢?特別是在ie和ff瀏覽器下。
而且在用到jquery插件庫的時候會發現,alert除了在ie和Opera瀏覽器不彈出來外,其他瀏覽器均彈出來,這是為什麼呢? !
主要是window.onload事件是在頁面dom元素載入完後執行,也就包含了img圖片中src載入完成。那麼img.onload 就不會執行了,
因為其是監聽img的src是否載入完成。
那麼,如何對img圖片進行onload事件綁定呢?具體代碼如下:
複製代碼 代碼如下:





img onload事件綁定(正確用法)



img onload事件綁定各瀏覽器皆可執行_基礎知識



這種方法,在各瀏覽器下均執行alert(1)。
也就是在頁面dom元素載入完成後,取得img的dom對象,取得其src屬性,再將其src設定為''空,然後監聽img的onload事件,最後再設定img的src屬性即可。
陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
jquery绑定事件有几种方式?jquery绑定事件有几种方式?Nov 09, 2020 pm 03:30 PM

jquery绑定事件有4种方式,分别为:bind()、live()、delegate()和on()方法;其中bind()方法只能针对已经存在的元素进行事件的绑定,而live()、on()、delegate()均支持未来新添加元素的事件绑定。

解决UniApp报错:'xxx'事件未绑定的问题解决UniApp报错:'xxx'事件未绑定的问题Nov 25, 2023 am 10:56 AM

在使用UniApp开发应用时,可能会遇到以下错误提示:'xxx'事件未绑定。这是由于UniApp的事件绑定机制导致的,需要正确设置才能解决该问题。一、问题原因在UniApp中,页面组件的事件绑定是通过v-on指令完成的。例如,在模板中添加一个按钮组件:<button@click="onClick">点击我</butto

Vue应用中遇到"click"事件绑定无效怎么办?Vue应用中遇到"click"事件绑定无效怎么办?Jun 24, 2023 pm 03:51 PM

Vue是一款流行的JavaScript框架,用于构建现代的Web应用程序。在Vue中,我们通常使用指令来实现DOM元素的操作。其中,"click"事件是常用的一个指令之一,然而,在Vue应用程序中,我们经常会遇到"click"事件绑定无效的情况。本文将介绍解决这一问题的方法。检查元素是否存在第一步是确认要绑定"click"事件的元素是否存在。如果元素不存在,

深度探讨jQuery事件绑定技术深度探讨jQuery事件绑定技术Feb 26, 2024 pm 07:36 PM

jQuery是一种流行的JavaScript库,被广泛用于处理Web页面的交互性。其中,事件绑定是jQuery的重要功能之一,通过事件绑定可以实现对用户交互操作的响应。本文将探讨jQuery事件绑定技术,并给出具体的代码示例。一、事件绑定的基本概念事件绑定是指在DOM元素上添加事件监听器,以便在特定事件发生时执行指定的操作。在jQuery中,通过选择器选中需

怎么给元素添加事件?JS绑定事件三种方式解析怎么给元素添加事件?JS绑定事件三种方式解析Aug 04, 2022 pm 07:27 PM

javascript作为脚本语言, 可以为页面上的元素绑定事件,用于在指定事件发生时能自动调用相应的事件处理程序处理事件。那么怎么给元素添加事件?下面本篇文章给大家介绍一下JS绑定事件三种方式,希望对大家有所帮助!

深入剖析jQuery事件绑定技巧深入剖析jQuery事件绑定技巧Feb 26, 2024 pm 06:33 PM

jQuery是一种流行的JavaScript库,它简化了网页开发中的许多常见任务,其中包括元素选择、DOM操作和事件处理。在jQuery中,事件绑定是非常常见和重要的操作之一。本文将详细探讨jQuery中事件绑定的方法,并通过具体的代码示例来帮助读者更好地理解和应用这些方法。1.bind()方法bind()方法是最传统也是最常用的事件绑定方法之一。它可

Vue文档中的事件绑定函数参数的使用方法Vue文档中的事件绑定函数参数的使用方法Jun 20, 2023 pm 02:06 PM

Vue是一个流行的JavaScript框架,它采用了数据驱动的思想来简化开发流程。Vue的事件绑定功能是非常强大的,可以对页面中的各种交互进行处理。在Vue的开发过程中,经常会使用到事件绑定函数参数,本文将详细介绍这个功能的使用方法。在Vue中,可以使用v-on指令来绑定事件。v-on指令后面跟着事件名和事件处理函数,例如:<bu

jquery绑定事件有什么作用jquery绑定事件有什么作用Mar 20, 2023 am 10:52 AM

jquery绑定事件的作用:将普通的事件event绑定在DOM节点上,当DOM节点被选中时,将事件与之绑定,方便用户提供相应的操作。jQuery中提供了四种事件绑定方式,分别是bind、live、delegate、on,对应的解除监听的函数分别是unbind、die、undelegate、off。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前By尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
4 週前By尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

將Eclipse與SAP NetWeaver應用伺服器整合。

EditPlus 中文破解版

EditPlus 中文破解版

體積小,語法高亮,不支援程式碼提示功能

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序,非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具,幫助Web開發人員更好地理解保護網路應用程式的過程,並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞,難度各不相同。請注意,該軟體中

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器