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 相关文章推荐
获取DOM对象的几种扩展及简写
Oct 09 Javascript
当滚动条滚动到页面底部自动加载增加内容的js代码
May 13 Javascript
js判断某个方法是否存在实例代码
Jan 10 Javascript
jQuery中unwrap()方法用法实例
Jan 16 Javascript
浅谈Vue的基本应用
Dec 27 Javascript
js实现把图片的绝对路径转为base64字符串、blob对象再上传
Dec 29 Javascript
Bootstrap3 模态框使用实例
Feb 22 Javascript
JS中使用正则表达式g模式和非g模式的区别
Apr 01 Javascript
JS获取当前时间的实例代码(昨天、今天、明天)
Nov 13 Javascript
JavaScript实现选项卡效果的分析及步骤
Apr 16 Javascript
微信小程序页面滚动到指定位置代码实例
Sep 07 Javascript
微信小程序淘宝首页双排图片布局排版代码(推荐)
Oct 29 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在XP下IIS和Apache2服务器上的安装
2006/09/05 PHP
PHP的FTP学习(一)[转自奥索]
2006/10/09 PHP
再次研究下cache_lite
2007/02/14 PHP
PHP设计模式之代理模式的深入解析
2013/06/13 PHP
php实现改变图片直接打开为下载的方法
2015/04/14 PHP
原生php实现excel文件读写的方法分析
2018/04/25 PHP
PHP加MySQL消息队列深入理解
2021/02/27 PHP
用JQuery调用Session的实现代码
2010/10/29 Javascript
文本框(input)获取焦点(onfocus)时样式改变的示例代码
2014/01/10 Javascript
如何防止回车(enter)键提交表单
2014/05/11 Javascript
运用jQuery定时器的原理实现banner图片切换
2014/10/22 Javascript
js查看一个函数的执行时间实例代码
2015/09/12 Javascript
input框中的name和id的区别
2016/11/16 Javascript
bootstrap datetimepicker日期插件超详细使用方法介绍
2017/02/23 Javascript
angularjs select 赋值 ng-options配置方法
2018/02/28 Javascript
json对象及数组键值的深度大小写转换问题详解
2018/03/30 Javascript
如何用RxJS实现Redux Form
2018/12/29 Javascript
vue百度地图 + 定位的详解
2019/05/13 Javascript
js实现蒙版效果
2020/01/11 Javascript
[06:33]DOTA2亚洲邀请赛小组赛第二日 TOP10精彩集锦
2015/01/31 DOTA
[05:08]DOTA2-DPC中国联赛3月6日Recap集锦
2021/03/11 DOTA
Python程序员鲜为人知但你应该知道的17个问题
2014/06/04 Python
分享几道你可能遇到的python面试题
2017/07/24 Python
Pytorch在dataloader类中设置shuffle的随机数种子方式
2020/01/14 Python
CSS3使用transition属性实现过渡效果
2018/04/18 HTML / CSS
video实现有声音自动播放的实现方法
2020/05/20 HTML / CSS
世界上最好的威士忌和烈性酒购买网站:The Whisky Exchange
2016/11/20 全球购物
如何让Java程序执行效率更高
2014/06/25 面试题
东方红海科技面试题软件测试方面
2012/02/08 面试题
个人职业生涯规划书1500字
2013/12/31 职场文书
《和我们一样享受春天》教学反思
2014/02/07 职场文书
公务员政审个人鉴定
2014/02/25 职场文书
课外活动总结范文
2014/07/09 职场文书
小学校园广播稿(3篇)
2014/09/19 职场文书
2016银行招聘自荐信
2016/01/28 职场文书
深入理解mysql事务隔离级别和存储引擎
2022/04/12 MySQL