解决Jquery向页面append新元素之后事件的绑定问题


Posted in Javascript onMarch 16, 2015

我先看jq api文档没有找到方法,无果只好到网上找些资料,果然找到live方法。

其实很简单:

解决Jquery向页面append新元素之后事件的绑定问题

1.这是项目要求达到的效果,当我没用live事件,只用了简单的hover事件时:hover事件没有加载进来,没有我想要的边框效果,效果图如下

解决Jquery向页面append新元素之后事件的绑定问题

/*经过用户技能标签增加样式*/


$(function(){
 



$(".s-edited").hover(function(){


   

 $(this).toggleClass("borderd");



})


})

2.当我用了live之后,效果达到了,如下图:

解决Jquery向页面append新元素之后事件的绑定问题

代码如下:

/*经过用户技能标签增加样式*/


$(".s-edited").live("hover",function(){



$(this).toggleClass("borderd");


})

我仔细的看了一下关于live的介绍,

给所有当前以及 将来 会匹配的元素绑定一个事件处理函数(比如hover事件)。也能绑定自定义事件。

PS:我是新手菜鸟,大神勿喷!

以上就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
一个无限级XML绑定跨框架菜单(For IE)
Jan 27 Javascript
JavaScript Event学习第三章 早期的事件处理程序
Feb 07 Javascript
解决jQuery插件tipswindown与hintbox冲突
Nov 05 Javascript
分享精心挑选的12款优秀jQuery Ajax分页插件和教程
Aug 09 Javascript
js判断样式className同时增加class或删除class
Jan 30 Javascript
form.submit()不能提交表单的原因分析
Oct 23 Javascript
如何在MVC应用程序中使用Jquery
Nov 17 Javascript
js 博客内容进度插件详解
Feb 19 Javascript
vue实现留言板todolist功能
Aug 16 Javascript
JavaScript基于数组实现的栈与队列操作示例
Dec 22 Javascript
Nuxt.js 静态资源和打包的操作
Nov 06 Javascript
微信小程序基础教程之echart的使用
Jun 01 Javascript
jquery中radio checked问题
Mar 16 #Javascript
jquery中JSON的解析方式
Mar 16 #Javascript
浅谈js中的闭包
Mar 16 #Javascript
js完美实现@提到好友特效(兼容各大浏览器)
Mar 16 #Javascript
JavaScript DSL 流畅接口(使用链式调用)实例
Mar 15 #Javascript
JavaScript中的DSL元编程介绍
Mar 15 #Javascript
JavaScript中的立即执行函数表达式介绍
Mar 15 #Javascript
You might like
thinkphp 多表 事务详解
2013/06/17 PHP
php中常见的sql攻击正则表达式汇总
2014/11/06 PHP
php单例模式示例分享
2015/02/12 PHP
php从文件夹随机读取文件的方法
2015/06/01 PHP
phpmailer绑定邮箱的实现方法
2016/12/01 PHP
jQuery ajax+PHP实现的级联下拉列表框功能示例
2019/02/12 PHP
showModelessDialog()使用详解
2006/09/21 Javascript
设置jsf的选择框h:selectOneMenu为不可编辑状态的方法
2014/01/07 Javascript
node.js中的fs.lchown方法使用说明
2014/12/16 Javascript
JavaScript插件化开发教程 (三)
2015/01/27 Javascript
JS实现消息来时让网页标题闪动效果的方法
2016/04/20 Javascript
AngularJS入门教程之服务(Service)
2016/07/27 Javascript
bootstrap按钮插件(Button)使用方法解析
2017/01/13 Javascript
vue.js 1.x与2.0中js实时监听input值的变化
2017/03/15 Javascript
基于Vue框架vux组件库实现上拉刷新功能
2017/11/28 Javascript
vue项目中导入swiper插件的方法
2018/01/30 Javascript
vue中实现先请求数据再渲染dom分享
2018/03/17 Javascript
在vue中获取token,并将token写进header的方法
2018/09/26 Javascript
解决vue无法设置滚动位置的问题
2018/10/07 Javascript
微信小程序实现蒙版弹窗效果
2018/11/01 Javascript
python获取局域网占带宽最大3个ip的方法
2015/07/09 Python
对python中的pop函数和append函数详解
2018/05/04 Python
Python性能分析工具Profile使用实例
2019/11/19 Python
PyTorch中 tensor.detach() 和 tensor.data 的区别详解
2020/01/06 Python
matplotlib quiver箭图绘制案例
2020/04/17 Python
python三引号如何输入
2020/07/06 Python
Django:使用filter的pk进行多值查询操作
2020/07/15 Python
canvas需要在标签里直接定义宽高
2014/12/17 HTML / CSS
德国药房apodiscounter中文官网:德国排名前三的网上药店
2019/06/03 全球购物
存储过程和sql语句的优缺点
2014/07/02 面试题
关于.NET, HTML的五个问题
2012/08/29 面试题
在网络中有两台主机A和B,并通过路由器和其他交换设备连接起来,已经确认物理连接正确无误,怎么来测试这两台机器是否连通?如果不通,怎么来判断故障点?怎么排
2014/01/13 面试题
护士思想汇报
2014/01/12 职场文书
大学生军训广播稿
2014/01/24 职场文书
市场部规章制度
2014/01/24 职场文书
感恩节寄语2015
2015/03/24 职场文书