ajax的异步刷新事件绑定问题

最新推荐文章于 2022-05-11 16:50:34 发布
原创 最新推荐文章于 2022-05-11 16:50:34 发布 · 260 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文探讨了使用AJAX进行页面局部刷新时遇到的问题：已绑定事件的元素可能因刷新而失去事件绑定。提出了两种解决方案：一是将绑定事件的JS代码包含在异步加载过程中；二是将需要绑定事件的元素排除在异步刷新之外。

问题:ajax异步刷新页面之后,如果绑定事件的元素被刷新,则该元素的绑定事件会失效

方案 :  1 把绑定事件的js同时放入异步加载中

2绑定事件的元素排除在异步刷新之外

原理: js跟绑定的元素同时加载


如何手写Ajax实现异步刷新
10-19
为了手写Ajax实现异步刷新，我们需要熟悉JavaScript编程语言以及XMLHttpRequest对象的使用。虽然现代的Web开发中更多地使用了如jQuery这样的库来简化Ajax的实现，但在本例中，我们仍然会遵循传统的JavaScript实现...
dojo学习第二天 ajax异步请求之绑定列表
09-05
【dojo学习第二天 - AJAX异步请求之绑定列表】 在继续探讨Dojo的AJAX异步请求之前，让我们回顾一下上一课的内容。在《dojo学习第一天 Tab选项卡》中，我们学习了如何利用Dojo的选项卡插件创建用户友好的表单，这有...
JFinal自定义模板指令AjaxPortal-实现页面区域异步加载与刷新
weixin_33949359的博客
05-27 271
2019独角兽企业重金招聘Python工程师标准>>> ...
关于异步加载数据绑定同一个函数的问题
qq_40101922的博客
08-28 320
1、有一个需求：在一个页面中，信息都是从服务器异步加载到web前端的，信息渲染到前端是一个列表，每个列都有一个倒计时 2、难题：怎么给每个列绑定同一个函数呢 3、解决方法：在循环拼接列表的时候，给每个列一个唯一的id，在循环中调用时，把唯一的id传进去，这样就可以给每个列绑定同一个函数，并执行不同的倒计时时间戳 代码： $.ajax({   url: url,   success: func...
Vue 异步事件更新 & 异步Dom更新解决方案
热门推荐
章鱼小丸子
01-30 1万+
Vue 异步事更新件 & 异步Dom更新解决方案 Vue 异步事更新件 异步Dom更新解决方案 Question Action 1 正确姿势 2 一个试验 3 还有困惑 1. Question 最近遇到一个有点别扭的需求。 进入一个子页面，需要四个接口拿到四份数据【a,b,c,d】。 其中a,b正巧父级拿到过，在父级页面上用v-if指令保证a和b存在，
ajax异步刷新后jquery绑定函数失效解决
zs79198201的专栏
06-07 1726
ajax异步刷新后jquery绑定函数就会失效~ 弄了半天终于找到jquery代码失效的原因~   在网上搜索说有两种解决方法 一、重新绑定。。还没懂怎么重新绑定 二、加上live方法 如下图 //删除按钮 $('.delete').live("click",function(e){ var userId = $(this).attr("userId");
jq ajax异步刷新后之前绑定的事件失效
无痕的博客
05-11 455
jq ajax异步刷新后之前绑定的事件失效
ajax异步刷新 局部刷新,实现异步局部刷新Ajax详解【2019】
weixin_32896083的博客
08-06 410
该楼层疑似违规已被系统折叠隐藏此楼查看此楼Ajax是什么?ajax意为“Asynchronous Javascript And XML”(异步JavaScript和XML)，并不是新的技术，只是把原有的技术，整合到一起而已1.使用CSS和XHTML来表示。2. 使用DOM模型来交互和动态显示。3.使用XMLHttpRequest来和服务器进行异步通信。4.使用javascript来绑定和调用。A...
ajax异步刷新gridview,如何刷新Gridview的内容(ajax)
weixin_33040687的博客
08-05 544
前台部分:使用 ajax，局部刷新 GridView 进行数据绑定的简单实现function GetData(p) {document.getElementById("d").innerHTML = "正在读取数据……";h = window.XMLHttpRequest ? new window.XMLHttpRequest() : new ActiveXObject("MSXML2.XMLHT...
Ajax，按钮正确绑定事件
hgjhjk的博客
05-09 1672
在我们发送Ajax请求的时候，如果想在按钮上添加click绑定事件 会出现绑定不上的问题。 如图： 在按钮上添加 class = "edit_btn" 标识后，创建函数。 当点击 【修改】按钮后并未出现edit弹出框，如图： 为什么呢？ 页面刷新进行加载绑定事件，而刷新后的数据，是页面加载完成后发送的Ajax请求拿到的数据，是在绑定事件之后才创建出的按钮。 如何解决 如图： 1.可以在创建按钮的时候绑定。（当然，这样会出现代码多、耦合现象） 2.使用 $(document).on
ajax异步操作局部刷新,实现异步局部刷新Ajax详解【2019】
weixin_31458459的博客
08-05 1030
该楼层疑似违规已被系统折叠隐藏此楼查看此楼Ajax是什么?ajax意为“Asynchronous Javascript And XML”(异步JavaScript和XML)，并不是新的技术，只是把原有的技术，整合到一起而已1.使用CSS和XHTML来表示。2. 使用DOM模型来交互和动态显示。3.使用XMLHttpRequest来和服务器进行异步通信。4.使用javascript来绑定和调用。A...
使用ajax局部刷新gridview进行数据绑定示例
10-26
本示例将详细讲解如何使用Ajax实现GridView的局部刷新和数据绑定。 首先，我们需要理解Ajax的基本原理。Ajax的核心是JavaScript的XMLHttpRequest对象，它可以异步地向服务器发送请求，并接收响应。在ASP.NET中，...
ajax实现异步刷新
04-07
本教程将通过一个具体的例子来讲解如何在ASP.NET环境中实现Ajax异步刷新。 首先，`Default2.aspx`和`Default.aspx`是ASP.NET中的两个网页文件，它们通常包含HTML、CSS和JavaScript代码，用于构建用户界面。`Default...
react setState直接赋值对象
06-17 2938
写法:可以自动解构对象到state中 let a={bb:1} this.setState(a); 使用 {this.state.bb}就直接获取值
金额格式化 处理 (每三位逗号分隔)
07-16 1657
/* * formatMoney(s,type) 只针对元 * 功能：金额按千位逗号分隔，负号用- * 参数：s，需要格式化的金额数值. * 参数：type,判断格式化后的金额是否需要小数位. * 返回：返回格式化后的数值字符串. */ const formatMoney = (s, type) => { var result = s; if (s < 0) { s = 0 - s; } if (/[^0-9\.]/.test(s)) { retu..
数组数据 转化为 树状结构数据
07-16 1578
codepen地址: codepen地址 var aTree = [ {"id": "1", "name": "动物", "pid": "0"}, {"id": "2", "name": "鸟类", "pid": "5"}, {"id": "3", "name": "无脊椎动物", "pid": "1"}, {"id": "4", "name": "哺乳动物", "pid": "5"}, {"id": "5", "name": "脊椎动物", "pid": "1
react-native 安卓下 webView自动播放
06-28 563
https://github.com/react-native-community/react-native-webview/issues/859 <WebView style={{ flex: 1 }} source={{ html }}mediaPlaybackRequiresUserAction={((Platform.OS !== 'android') || (Platform.Version >= 17)) ? false : undefined} userAgent="Mozill
vue $on 重复触发 解决方案
04-07 547
原理:绑定前先解绑以前的绑定 //main.js中添加$bus,使用 this.$bus.$on , this.$bus.$emit Vue.prototype.$bus = new Vue() Vue.prototype.addEvent = function (key, fallback) { this.$bus.$off(key); this.$bus.$on(key, fallback); };
web新开页面js(第三方登录重定向)
07-24 474
代码来源https://github.com/PanJiaChen/vue-element-admin 向大佬致敬 //新开页面js export default function openWindow(url, title, w, h) { // Fixes dual-screen position Most browsers Firefox const dualScreenLeft = window.screenLeft..
实现网页无刷新的AJAX异步操作指南
标题“ajax异步 网页无刷新”揭示了本次讨论的核心技术——AJAX（Asynchronous JavaScript and XML）技术的应用，它是实现Web页面异步数据交互和无刷新更新的关键技术。描述中提供的信息，则是对整个AJAX操作流程的...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值