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 delete 属性的使用
Oct 08 Javascript
js Dialog 实践分享
Oct 22 Javascript
JavaScript 中的日期和时间及表示标准介绍
Aug 21 Javascript
Node.js和PHP根据ip获取地理位置的方法
Mar 14 Javascript
jQuery封装的tab选项卡插件分享
Jun 16 Javascript
avalon js实现仿微博拖动图片排序
Aug 14 Javascript
深入分析Javascript事件代理
Jan 30 Javascript
jquery设置表单元素为不可用的简单代码
Jul 04 Javascript
jQuery的事件预绑定
Dec 05 Javascript
JS实现列表页面隔行变色效果
Mar 25 Javascript
基于ajax及jQuery实现局部刷新过程解析
Sep 12 jQuery
JS中如何优雅的使用async await详解
Oct 05 Javascript
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提取视频网站页面中的FLASH地址的代码
2010/04/17 PHP
phpstudy的php版本自由修改的方法
2017/10/18 PHP
跟着JQuery API学Jquery 之二 属性
2010/04/09 Javascript
firebug的一个有趣现象介绍
2011/11/30 Javascript
网页编辑器ckeditor和ckfinder配置步骤分享
2012/05/24 Javascript
jquery聚焦文本框与扩展文本框聚焦方法
2012/10/12 Javascript
js闭包实例汇总
2014/11/09 Javascript
javascript获取select值的方法分析
2015/07/02 Javascript
Bootstrap每天必学之栅格系统(布局)
2015/11/25 Javascript
jquery获取css的color值返回RGB的方法
2015/12/18 Javascript
AngularJS实现按钮提示与点击变色效果
2016/09/07 Javascript
通过原生JS实现为元素添加事件的方法
2016/11/23 Javascript
JavaScript正则表达式exec/g实现多次循环用法示例
2017/01/17 Javascript
Vue.js 2.5新特性介绍(推荐)
2017/10/24 Javascript
在 Typescript 中使用可被复用的 Vue Mixin功能
2018/04/17 Javascript
微信小程序导航栏滑动定位功能示例(实现CSS3的positionsticky效果)
2019/01/24 Javascript
JavaScript中Dom操作实例详解
2019/07/08 Javascript
微信小程序开发之map地图组件定位并手动修改位置偏差
2019/08/17 Javascript
vue如何实现动态加载脚本
2020/02/05 Javascript
Javascript如何实现双指控制图片功能
2020/02/25 Javascript
使用Python获取Linux系统的各种信息
2014/07/10 Python
python Django框架实现自定义表单提交
2016/03/25 Python
学习Python selenium自动化网页抓取器
2018/01/20 Python
Python实现的用户登录系统功能示例
2018/02/05 Python
Python计算一个给定时间点前一个月和后一个月第一天的方法
2018/05/29 Python
pytorch + visdom 处理简单分类问题的示例
2018/06/04 Python
Python3实现的旋转矩阵图像算法示例
2019/04/03 Python
pyqt5 comboBox获得下标、文本和事件选中函数的方法
2019/06/14 Python
如何让IE9以下版本(ie6/7/8)认识html5元素
2013/04/01 HTML / CSS
html5唤醒APP小记
2019/03/27 HTML / CSS
美国经典刺绣和字母儿童服装特卖:Smocked Auctions
2018/07/16 全球购物
违反校纪校规检讨书
2014/02/15 职场文书
施工安全标语
2014/06/07 职场文书
宣传口号大全
2014/06/16 职场文书
考察邀请函范文
2015/01/31 职场文书
社区志愿服务活动感想
2015/08/07 职场文书