开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

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

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

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

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

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

相关搜索:ng-href在我点击链接或地址栏时，除了更新链接或地址栏之外没有响应(Angular Js)ShareThis按钮在移动设备上不起作用，当我点击它时，没有模式窗口或弹出窗口 VueJs在第一次点击或第一次事件时不起作用 window.addEventListener('load'，(event) => {...})；在NuxtLink (nuxt-window.addEventListener)或RouterLink (路由器链接)上单击会话在单击链接时起作用，但在URL中键入链接地址或在浏览器中单击“返回”按钮时不起作用在点击链接时触发函数(看起来有效，但在弹出窗口中不起作用)如何将Vscode控制台链接到单独的cmd或powershell，以便在运行命令时在单独的窗口中返回结果移动Safari:视频元素上的链接(<a>)元素在点击时不起作用物联网设备视频智能应用新春大促 IoT Link新春大促

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

什么是 JavaScript 事件？

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

1932 0

前端成神之路-WebAPIs05

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

1.5K1 0

常见网页特效案例

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

2.2K4 0

HTML5中的拖放功能

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

2.6K1 0

「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事件。

4921 0

前端成神之路-WebAPIs06

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

1.3K4 0

「JavaScript 」动画基础 - 02

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

3442 0

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

在浏览器地址栏输入地址，然后点击跳转；点击页面的链接实现跳转；关闭或刷新当前页面; 操作当前页面的Location对象,修改当前页面地址; 调用window.navigate实现跳转; 调用window.open...return msg } 通过DOM0 Event Model的方式监听beforeunload事件时，只需返回值不为undefined或null，即会弹出二次确定对话框。...实验代码： // 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.3K9 0

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.2K2 0

ES6--对象、函数的扩展

() {} doSomething.name; // "doSomething" (new Function()).name; // "anonymous" 取值函数存值函数在方法名的前面加上set...// ES5 var name = "window"; var obj = { name: "obj", sayName: function(){ return function(){...，会跟随上下文绑定到上层，所以在不确定上下文绑定结果的情况下，尽可能不要在箭头函数中使用arguments，而要使用…args。...多返回值方式一：使用对象作为返回载体 Syntax: {arg1, arg2} = {arg1: value1, arg2: value2} function test() { return...数组作为返回载体与使用对象作为返回载体区别是：数组需要让被赋予的变量（或常量）名按照数组的顺序获取。

4653 1

16个超实用的jQuery技巧攻略

(){ $('html').css('font-size', originalFontSize); }); }); 3）在新窗口打开链接使用这段代码会帮助用户在新窗口打开链接...value in the rel $('link[rel=stylesheet]').attr('href' , $(this).attr('rel')); }); }); 5）返回到顶部链接...此代码对于长时间点击单页面非常实用，你可以在重要关头点击“返回顶部”功能。...(){ parseJson(); }); 14、隔行换色这是一个很老的功能了，在大的列表或表格中，隔行颜色可以大大提高内容的可读性。...}, 100); }); 16、让整个 Div 可点击这是实现链接的父 Div 也能够点击的简单方法，HTML 示例代码如下： blah blah

1K3 0

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.6K1 0

Bootstrap Bootstrap表格插件bootstrap-table配置与应用小结

-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ --> {% load staticfiles %} <!...这会导致自定义的 pageList不起作用 silentSort:true, // 设置为true将在点击分页按钮时，自动记住排序项。...left' 或 'right'。...// 给操作按钮注册点击事件 window.operateEvents = { 'click .asign-resource': function (event, value, row, index)

12.9K2 0

JavaWeb – GET 请求中 URL 的最大长度限制（附：解决方案）

今天在写一个 PHP 相应 JSOUP 请求的功能时，发现当 URL 中包含的请求参数过长时会返回 414 错误。...3、Chrome chrome（谷歌）的url长度限制超过8182个字符返回本文开头时列出的错误。支持的最大中文字符只有8182/9=909个。...但当url超过8000字符时会返回413错误。这个限制可以被修改，在Daemon.pm查找16×1024并更改成更大的值。 4、Ngnix 可以通过修改配置来改变url请求串的url长度限制。...newsId=" + newsId; window.open(url); } 预览页取内容时这样写： $(document).ready(function() { var newsId...window.sessionStorage) { window.sessionStorage = { getItem: function(sKey) {

3.4K3 0

WebAudio API

|| window.webkitAudioContext || window.mozAudioContext || window.msAudioContext) //由于API兼容性问题，需要在创建时加上后缀...' }) .then(res => { //将返回的数据转成arrayBuffer数据，并返回 return res.arrayBuffer...() { //文件长度不为0则真的选中了文件，因为用户点击取消也会触发onchange事件。...}; fr.readAsArrayBuffer(files); //同样的，ArrayBuffer方式读取 } }; GainNode gain是在音乐播放之前处理声音大小的中间件...不再是连接destination了，否则音频没有经过gain处理，效果不会生效 source.connect(gain); //设置gain.gain.value 的值，跟随

1.2K2 0

所有前端都必须知道的 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 中无效。

2K10 0

所有前端都必须知道的 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 中无效。

2K7 0

所有前端都必须知道的 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.7K2 0

一些好用的jquery技巧

(function () { console.log('image load successful'); }); 你也可以用ID或类替换标签来检查某个特定的图像是否被加载。...5、悬停切换类假设你希望当用户将鼠标悬停在可点击的元素上时，它会改变颜色。...但是，如果你想要元素在第一次点击的时候出现，然后在第二次点击的时候消失的话，那么可以试试下面的代码： // Fade $('.btn').click(function () { $('.element'...() { $(this).find('.column').height($(this).height()); }); 11、在新标签页/窗口打开外部链接在一个新的浏览器tab或窗口中打开外部链接，并确保同一个来源的链接能在同一个...Visibility时触发当用户不再关注某个tab，或重新聚焦原来的那个tab上时，触发JavaScript： $(document).on('visibilitychange', function

3.9K6 0

元素偏移量 offset 系列

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

1.2K2 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭