jQuery中change事件用法实例


Posted in Javascript onDecember 26, 2014

本文实例讲述了jQuery中change事件用法。分享给大家供大家参考。具体分析如下:

change事件会在匹配元素失去焦点或者其值获得焦点并且改变时触发。

一个完整的事件过程,不但要有能够触发事件的条件,而且还要有事件处理程序。
可以通过change()方法为change事件绑定事件处理程序。例如:

$("input").change(function(){$("input").css("backgroundColor","green")})

以上代码就是将function函数作为事件处理程序通过change()方法绑定到change事件。当触发change事件的时候,就会调此函数。
实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> 

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("input").change(function(){

    $("input").css("backgroundColor","green")

  }) 

}) 

</script> 

</head> 

<body> 

<div><input type="text" name="content" /></div> 

<div>改变文本框文字就会触发事件</div> 

</body> 

</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
Javascript的时间戳和php的时间戳转换注意事项
Apr 12 Javascript
js图片实时加载提供网页打开速度
Sep 11 Javascript
jQuery中:last-child选择器用法实例
Dec 31 Javascript
为什么JS中eval处理JSON数据要加括号
Apr 13 Javascript
jQuery中hover与mouseover和mouseout的区别分析
Dec 24 Javascript
jQuery实现点击行选中或取消CheckBox的方法
Aug 01 Javascript
Bootstrap CSS组件之按钮组(btn-group)
Dec 17 Javascript
JavaScript判断浏览器和hack滚动条的写法
Jul 23 Javascript
Vue循环组件加validate多表单验证的实例
Sep 18 Javascript
VSCode写vue项目一键生成.vue模版,修改定义其他模板的方法
Apr 17 Javascript
VUE 实现element upload上传图片到阿里云
Aug 12 Javascript
vue实现广告栏上下滚动效果
Nov 26 Vue.js
jQuery中mouseover事件用法实例
Dec 26 #Javascript
javascript实现禁止右键和F12查看源代码
Dec 26 #Javascript
Angularjs 基础入门
Dec 26 #Javascript
jQuery 实现侧边浮动导航菜单效果
Dec 26 #Javascript
Javascript的闭包详解
Dec 26 #Javascript
jQuery中focus事件用法实例
Dec 26 #Javascript
生成二维码方法汇总
Dec 26 #Javascript
You might like
php.ini-dist 和 php.ini-recommended 的区别介绍(方便开发与安全的朋友)
2012/07/01 PHP
Laravel 5框架学习之子视图和表单复用
2015/04/09 PHP
将json对象转换为字符串的方法
2014/02/20 Javascript
JS实现在状态栏显示打字效果完整实例
2015/11/02 Javascript
jQuery实现简单的网页换肤效果示例
2016/09/18 Javascript
js浏览器html5表单验证
2016/10/17 Javascript
微信小程序 倒计时组件实现代码
2016/10/24 Javascript
easyui 中的datagrid跨页勾选问题的实现方法
2017/01/18 Javascript
JS如何实现手机端输入验证码效果
2020/05/13 Javascript
微信小程序实现选项卡滑动切换
2020/10/22 Javascript
[00:32]2018DOTA2亚洲邀请赛Secret出场
2018/04/03 DOTA
phpsir 开发 一个检测百度关键字网站排名的python 程序
2009/09/17 Python
python实现多线程的两种方式
2016/05/22 Python
Java分治归并排序算法实例详解
2017/12/12 Python
Python实现生成随机日期字符串的方法示例
2017/12/25 Python
Python  unittest单元测试框架的使用
2018/09/08 Python
win7 x64系统中安装Scrapy的方法
2018/11/18 Python
使用TensorFlow实现二分类的方法示例
2019/02/05 Python
django认证系统实现自定义权限管理的方法
2019/08/28 Python
Python数据库小程序源代码
2019/09/15 Python
Python文件操作函数用法实例详解
2019/12/24 Python
python连接mongodb数据库操作数据示例
2020/11/30 Python
HTML5 HTMLCollection和NodeList的区别详解
2020/04/29 HTML / CSS
劳力士官方珠宝商:J.R. Dunn Jewelers
2018/09/29 全球购物
Myprotein芬兰官网:欧洲第一运动营养品牌
2019/05/05 全球购物
个人生活学习自我评价范文
2013/11/26 职场文书
syb养殖创业计划书
2014/01/09 职场文书
银行内勤岗位职责
2014/04/09 职场文书
《社戏》教学反思
2014/04/15 职场文书
初三新学期计划书
2014/05/03 职场文书
车辆委托书范本
2014/10/05 职场文书
深入开展党的群众路线教育实践活动心得体会
2014/11/05 职场文书
2014年连锁店圣诞节活动方案
2014/12/09 职场文书
荆州古城导游词
2015/02/06 职场文书
小升初自荐信怎么写
2015/03/26 职场文书
解决linux下redis数据库overcommit_memory问题
2022/02/24 Redis