首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

`$(window).on('load',function() {...}`在链接跟随或返回点击时不起作用

$(window).on('load', function() {...}是jQuery中的一个事件绑定方法,用于在页面加载完成后执行特定的操作。它的作用是在整个页面及其所有资源(如图片、样式表等)都加载完成后触发相应的函数。

这个方法通常用于需要在页面完全加载后执行的操作,比如初始化页面元素、绑定事件、发送请求等。与其他事件绑定方法相比,$(window).on('load', function() {...}更适合处理需要等待页面加载完成后才能执行的任务。

在链接跟随或返回点击时不起作用的原因是,当用户点击链接跳转或返回按钮时,浏览器会重新加载新页面或从缓存中加载历史页面,此时$(window).on('load', function() {...}事件不会被触发,因为页面的加载已经完成。如果需要在链接跟随或返回点击时执行特定的操作,可以考虑使用其他适合的事件,如$(window).on('beforeunload', function() {...}用于在页面即将被卸载前执行操作。

腾讯云相关产品和产品介绍链接地址:

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

什么是 JavaScript 事件?

事件可以与网页上的元素相关联,例如按钮、链接、输入框等,也可以与整个文档浏览器窗口相关联。当事件被触发,可以执行预定义的JavaScript函数代码块,以响应事件并执行相应的操作。...(load): 页面滚动事件(scroll): 1:点击事件(click): 点击事件在用户点击一个元素触发。...你可以将点击事件用于按钮、链接、图像等元素,以执行相关操作。...; }); 2:鼠标移动事件(mousemove): 鼠标移动事件在用户一个元素上移动鼠标触发。你可以使用该事件来实现根据鼠标位置进行交互的效果,如跟随光标的特效。... window.addEventListener("load", function() { alert("页面加载完成!")

25320

前端成神之路-WebAPIs05

点击弹出层这个链接 link 让mask 和login 显示出来 link.addEventListener('click', function() {...移动黄色遮挡层,大图片跟随移动功能。 1.1.7. 案例分析: 黄色的遮挡层跟随鼠标功能。 把鼠标坐标给遮挡层不合适。因为遮挡层坐标以父盒子为准。 首先是获得鼠标盒子的坐标。...,这个事件页面显示触发,无论页面是否来自缓存。...重新加载页面中,pageshow会在load事件触发后触发;根据事件对象中的persisted来判断是否是缓存中的页面触发的pageshow事件 注意这个事件给window添加。...页面被卷去的头部 如果浏览器的高(宽)度不足以显示整个页面,会自动出现滚动条。当滚动条向下滚动,页面上面被隐藏掉的高度,我们就称为页面被卷去的头部。滚动条滚动时会触发 onscroll事件。

1.5K10
  • 常见网页特效案例

    2.点击右侧按钮一次,图片往左播放一张,以此类推,左侧按钮同理。 3.图片播放的同时,下面小圆圈模块跟随一起变化。 4.点击小圆圈,可以播放相应图片。...window.addEventListener('load', function() { // 1....案例:返回顶部 带有动画的返回顶部 此时可以继续使用我们封装的动画函数 只需要把所有的left 相关的值改为 跟 页面垂直滚动距离相关就可以了 页面滚动了多少,可以通过 window.pageYOffset...当我们点击返回顶部模块,就让窗口滚动的页面的最上方 goBack.addEventListener('click', function() { // 里面的x和...li, 就把li当前的位置存储起来,做为筋斗云的起始位置 window.addEventListener('load', function() { // 1.

    2.3K40

    HTML5中的拖放功能

    事件 第三,拖放的元素进入本元素的范围内触发,事件的作用对象是拖放过程中光标经过的元素-dragenter元素 第四,拖放的元素正在本元素的范围内移动触发,事件的作用对象是拖放过程中光标经过的元素...-dragover元素 第五,拖放的元素离开本元素的范围触发,事件的作用对象是拖放过程中光标经过的元素-dragleave元素 第六,拖放的元素被拖放到本元素中触发,事件的作用对象是拖放的目标元素...监听事件 window.addEventListener("load",DragStart,false); 添加dragover监听事件,给拖放的目标元素添加dragover监听事件,事件触发改变目标元素的样式...监听事件 window.addEventListener("load",Drop, false); 文件api html5中提供了关于文件操作的文件api,通过编程方式选择和访问文件数据。...触发的事件 proress事件,当正在读取数据触发的事件 load事件,当成功完成数据读取触发的事件 abort事件,当中断读取数据触发的事件 error事件,当读取数据发生错误时触发的事件

    2.6K10

    「JavaScript 」动画基础 - 01

    点击弹出层这个链接 link 让mask 和login 显示出来 link.addEventListener('click', function() { mask.style.display...移动黄色遮挡层,大图片跟随移动功能。 1.1.7. 案例分析: 黄色的遮挡层跟随鼠标功能。 把鼠标坐标给遮挡层不合适。因为遮挡层坐标以父盒子为准。 首先是获得鼠标盒子的坐标。...如果小于零,就把坐标设置为0 如果大于遮挡层最大的移动距离,就把坐标设置为最大的移动距离 遮挡层的最大移动距离:小图片盒子宽度 减去 遮挡层盒子宽度 window.addEventListener('load...('load', function() { // 页面加载完毕执行js代码 // 获取页面元素 var imgBox = this.document.querySelector('.preview_img...页面被卷去的头部 如果浏览器的高(宽)度不足以显示整个页面,会自动出现滚动条。当滚动条向下滚动,页面上面被隐藏掉的高度,我们就称为页面被卷去的头部。滚动条滚动时会触发onscroll事件。

    50310

    前端成神之路-WebAPIs06

    2.点击右侧按钮一次,图片往左播放一张,以此类推,左侧按钮同理。 ​ 3.图片播放的同时,下面小圆圈模块跟随一起变化。 ​ 4.点击小圆圈,可以播放相应图片。 ​...window.addEventListener('load', function() { // 1....案例:返回顶部 带有动画的返回顶部 此时可以继续使用我们封装的动画函数 只需要把所有的left 相关的值改为 跟 页面垂直滚动距离相关就可以了 页面滚动了多少,可以通过 window.pageYOffset...当我们点击返回顶部模块,就让窗口滚动的页面的最上方 goBack.addEventListener('click', function() { // 里面的x和..., 就把li当前的位置存储起来,做为筋斗云的起始位置 window.addEventListener('load', function() { // 1.

    1.3K40

    「JavaScript 」动画基础 - 02

    点击右侧按钮一次,图片往左播放一张,以此类推,左侧按钮同理。 图片播放的同时,下面小圆圈模块跟随一起变化。 点击小圆圈,可以播放相应图片。 鼠标不经过轮播图,轮播图也会自动播放图片。...window.addEventListener('load', function() { // 1....案例:返回顶部 带有动画的返回顶部 此时可以继续使用我们封装的动画函数 只需要把所有的left 相关的值改为 跟 页面垂直滚动距离相关就可以了 页面滚动了多少,可以通过 window.pageYOffset...当我们点击返回顶部模块,就让窗口滚动的页面的最上方 goBack.addEventListener('click', function() { // 里面的x和y 不跟单位的 直接写数字即可..., 就把li当前的位置存储起来,做为筋斗云的起始位置 window.addEventListener('load', function() { // 1.

    36420

    JS魔法堂:定义页面的Dispose方法——unload事件启示录

    浏览器地址栏输入地址,然后点击跳转; 点击页面的链接实现跳转; 关闭刷新当前页面; 操作当前页面的Location对象,修改当前页面地址; 调用window.navigate实现跳转; 调用window.open...return msg }  通过DOM0 Event Model的方式监听beforeunload事件,只需返回值不为undefinednull,即会弹出二次确定对话框。...实验代码: // index.html window.addEventListener('load', function(){ console.log("index.load") window.test.../next.html">next.html // next.html window.addEventListener('load', function(){ console.log("next.load...) }) 运行环境:FireFox 操作步骤:1.首先访问index.html,2.然后点击链接跳转到next.html,3.然后点击浏览器的回退按钮跳转到index.html,4.最后点击浏览器的前进按钮跳转到

    2.3K90

    BOM

    window 对象是浏览器的顶级对象。 它是 JS 访问浏览器窗口的一个接口 它是一个全局对象。定义全局作用域中的变量函数都会变成 window 对象的属性和方法。...("load", function(){}); 是窗口(页面)加载事件,当文档内容完全加载完成后会触发事件(包括图像、脚本文件、CSS 文件等),就调用的处理函数。...用法和 load 事件类似。 调整窗口大小事件 window.addEventListener("resize", function(){}); 只要窗口大小发生变化,就会触发事件。...更详细见 P280 location 对象 什么是 location 对象 window 对象给我们提供了一个 location 属性用于获取设置窗体的 URL,并且可以用于解析 URL。...name=andy&age=18#link location 对象的属性 location 对象属性 返回值 location.href 获取设置整个 URL location.host 返回域名

    1.2K20

    JS事件篇

    :事件 浏览器加载一个页面,是按照自上而下的顺序加载的,读取到一行就运行一行,如果将script标签写到页面上边,代码执行的时候,页面还没有完全加载 window.onload事件会在整个页面加载完成之后...当我们给a标签添加onclick事件处理函数并点击a触发其后, 如果相应JavaScript代码返回true,onclick事件处理函数就会认为这个链接点击了,同样的若返回false即会认为链接...://www.baidu.com” οnclick=” return false; "> Click Me 当点击a标签,JavaScript代码返回值为false,故此链接默认行为未被触发...moveWithMe(obj) { //当鼠标obj区域里面按下,触发鼠标按下的事件 obj.onmousedown=function(event) { event...div,那么就让鼠标呆在点击出,而不是跑到左上角,计算出div每次鼠标点击需要的偏移量即可 ---- 鼠标滚轮事件----onmousewheel----火狐不支持,由DOMMouseScroll

    12.6K10

    所有前端都必须知道的 jQuery 技巧

    检查图像是否加载 有时为了继续脚本,你可能需要检查图像是否全部加载完毕: $('img').load(function () { console.log('image load successful...悬停切换类 假设你希望当用户将鼠标悬停在可点击的元素上,它会改变颜色。...但是,如果你想要元素第一次点击的时候出现,然后第二次点击的时候消失的话,那么可以试试下面的代码: // Fade $('.btn').click(function () { $('.element...新标签页 / 窗口打开外部链接 一个新的浏览器 tab 窗口中打开外部链接,并确保同一个来源的链接能在同一个 tab 或者窗口中打开: $('a[href^="http"]').attr('target...'"]').attr('target', '_self'); 注意:window.location.origin IE10 中无效。

    2K100

    所有前端都必须知道的 jQuery 技巧

    检查图像是否加载   有时为了继续脚本,你可能需要检查图像是否全部加载完毕: $('img').load(function () { console.log('image load successful...悬停切换类   假设你希望当用户将鼠标悬停在可点击的元素上,它会改变颜色。...但是,如果你想要元素第一次点击的时候出现,然后第二次点击的时候消失的话,那么可以试试下面的代码: // Fade $('.btn').click(function () { $('.element...新标签页 / 窗口打开外部链接   一个新的浏览器 tab 窗口中打开外部链接,并确保同一个来源的链接能在同一个 tab 或者窗口中打开: $('a[href^="http"]').attr(...+ '"]').attr('target', '_self'); 注意:window.location.origin IE10 中无效。

    2K70

    所有前端都必须知道的 jQuery 技巧

    检查图像是否加载   有时为了继续脚本,你可能需要检查图像是否全部加载完毕: $('img').load(function () { console.log('image load successful...悬停切换类   假设你希望当用户将鼠标悬停在可点击的元素上,它会改变颜色。...但是,如果你想要元素第一次点击的时候出现,然后第二次点击的时候消失的话,那么可以试试下面的代码: // Fade $('.btn').click(function () { $('.element...新标签页 / 窗口打开外部链接   一个新的浏览器 tab 窗口中打开外部链接,并确保同一个来源的链接能在同一个 tab 或者窗口中打开: $('a[href^="http"]').attr('target...'"]').attr('target', '_self'); 注意:window.location.origin IE10 中无效。

    1.7K20

    元素偏移量 offset 系列

    获得元素距离带有定位父元素的位置,如果父级元素都没有定位,则以body位置为准 获得元素自身的大小(宽度高度) 注意:返回的数值都不带单位 ?...案例:获取鼠标盒子内的坐标 我们盒子内点击,想要得到鼠标距离盒子左右的距离。...点击弹出层这个链接 link 让mask 和login 显示出来        link.addEventListener('click', function() {                ...移动黄色遮挡层,大图片跟随移动功能。 案例分析: 黄色的遮挡层跟随鼠标功能。 把鼠标坐标给遮挡层不合适。因为遮挡层坐标以父盒子为准。 首先是获得鼠标盒子的坐标。...window.addEventListener('load', function() {    var preview_img = document.querySelector('.preview_img

    1.2K20

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    活动推荐

      运营活动

      活动名称
      广告关闭
      领券