解决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 相关文章推荐
JavaScript 图片预览效果 推荐
Dec 22 Javascript
基于jquery用于查询操作的实现代码
May 10 Javascript
ASP.NET jQuery 实例8 (动态添加内容到DropDownList)
Feb 03 Javascript
JS弹出窗口代码大全(详细整理)
Dec 21 Javascript
Three.js源码阅读笔记(物体是如何组织的)
Dec 27 Javascript
Js 导出table内容到Excel的简单实例
Nov 19 Javascript
jquery判断复选框选中状态以及区分attr和prop
Dec 18 Javascript
JS实现搜索框文字可删除功能
Dec 28 Javascript
bootstrap中添加额外的图标实例代码
Feb 15 Javascript
JavaScrpt判断一个数是否是质数的实例代码
Jun 11 Javascript
还不懂递归?读完这篇文章保证你会懂
Jul 29 Javascript
详解处理Vue单页面应用SEO的另一种思路
Nov 09 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
php实现水印文字和缩略图的方法示例
2016/12/29 PHP
IIS 7.5 asp Session超时时间设置方法
2017/04/17 PHP
PHP实现QQ登录的开原理和实现过程
2018/02/04 PHP
ThinkPHP框架实现FTP图片上传功能示例
2019/04/08 PHP
js打印纸函数代码(递归)
2010/06/18 Javascript
javascript textContent与innerText的异同分析
2010/10/22 Javascript
利用谷歌地图API获取点与点的距离的js代码
2012/10/11 Javascript
jquery+ajax+C#实现无刷新操作数据库数据的简单实例
2014/02/08 Javascript
NodeJS中利用Promise来封装异步函数
2015/02/25 NodeJs
快速掌握Node.js之Window下配置NodeJs环境
2016/03/21 NodeJs
BootstrapTable与KnockoutJS相结合实现增删改查功能【一】
2016/05/10 Javascript
JavaScript实战(原生range和自定义特效)简单实例
2016/08/21 Javascript
vue watch自动检测数据变化实时渲染的方法
2018/01/16 Javascript
小程序实现五星点评效果
2018/11/03 Javascript
vue实现微信分享链接添加动态参数的方法
2019/04/29 Javascript
windows下create-react-app 升级至3.3.1版本踩坑记
2020/02/17 Javascript
jQuery实现可以扩展的日历
2020/12/01 jQuery
让python json encode datetime类型
2010/12/28 Python
利用python3随机生成中文字符的实现方法
2017/11/24 Python
python实现定时自动备份文件到其他主机的实例代码
2018/02/23 Python
tensorflow入门之训练简单的神经网络方法
2018/02/26 Python
对python中执行DOS命令的3种方法总结
2018/05/12 Python
python爬虫 基于requests模块的get请求实现详解
2019/08/20 Python
python如何提取英语pdf内容并翻译
2020/03/03 Python
Python文件操作基础流程解析
2020/03/19 Python
解决Windows下python和pip命令无法使用的问题
2020/08/31 Python
草莓巧克力:Shari’s Berries
2017/02/07 全球购物
中学教师培训制度
2014/01/31 职场文书
教师党员一句话承诺
2014/03/28 职场文书
小学课外活动总结
2014/07/09 职场文书
2015年安全教育月活动总结
2015/03/26 职场文书
街道办残联2016年助残日活动总结
2016/04/01 职场文书
Nginx源码编译安装过程记录
2021/11/17 Servers
MySQL创建管理HASH分区
2022/04/13 MySQL
一文搞懂PHP中的抽象类和接口
2022/05/25 PHP
python如何将mat文件转为png
2022/07/15 Python