JQuery入门——用bind方法绑定事件处理函数应用介绍


Posted in Javascript onFebruary 05, 2013

1、bind()功能是为每个选择元素的事件绑定处理函数,其语法如下:bind(type, [data], fn)

其中type为一个或多个类型的字符串,如click或change,也可以自定义;可以被type调用的类型包括blur、focus、load、resize、scroll、unload、click、dbclick、mousedown等事件。参数data是作为event.data属性值传递对象的额外数据对象。参数fn是绑定到每个选择元素的事件中的处理函数。

2、示例代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>bind方法绑定事件</title> 
<script type="text/javascript" src="jquery-1.8.3.min.js"></script> 
<script type="text/javascript"> 
$(function(){ 
var intI=0; 
$("#btnBind").bind("click ",function(){ 
intI++; 
$(".clsShow").show().html("您好,欢迎来到JQuery世界!").append("<div>执行次数"+intI+"</div>"); 
$(this).attr("disabled","disabled");//按钮不可用 
}) 
}) 
</script> 
</head> 
<body> 
<input id="btnBind" type="button" value="Button" class="btn"/> 
<div class="clsShow"></div> 
</body> 
</html>

3、效果图预览

JQuery入门——用bind方法绑定事件处理函数应用介绍

再点击则无反应

Javascript 相关文章推荐
一份老外写的XMLHttpRequest代码多浏览器支持兼容性
Jan 11 Javascript
cnblogs 代码高亮显示后的代码复制问题解决实现代码
Dec 14 Javascript
常规表格多表头查询示例
Feb 21 Javascript
node.js中的fs.renameSync方法使用说明
Dec 16 Javascript
jQuery获取样式中颜色值的方法
Jan 29 Javascript
基于JavaScript实现鼠标箭头移动图片跟着移动
Aug 30 Javascript
详解AngularJS验证、过滤器、指令
Jan 04 Javascript
Vue通过URL传参如何控制全局console.log的开关详解
Dec 07 Javascript
HTML5+JS+JQuery+ECharts实现异步加载问题
Dec 16 jQuery
快速解决brew安装特定版本flow的问题
May 17 Javascript
详解vue2.0监听属性的使用心得及搭配计算属性的使用
Jul 18 Javascript
vue-cli设置css不生效的解决方法
Feb 07 Javascript
JQuery入门——用映射方式绑定不同事件应用示例
Feb 05 #Javascript
JQuery入门——事件切换之hover()方法应用介绍
Feb 05 #Javascript
JQuery入门——事件切换之toggle()方法应用介绍
Feb 05 #Javascript
JQuery入门——移除绑定事件unbind方法概述及应用
Feb 05 #Javascript
JQuery入门——用one()方法绑定事件处理函数(仅触发一次)
Feb 05 #Javascript
jquery 卷帘效果实现代码(不同方向)
Feb 05 #Javascript
window.open关于浏览器拦截问题分析及解决方法
Feb 05 #Javascript
You might like
重料打造自己的“宝马”---第三代
2021/03/02 无线电
打造计数器DIY三步曲(上)
2006/10/09 PHP
Yii2框架BootStrap样式的深入理解
2016/11/07 PHP
PHP回调函数与匿名函数实例详解
2017/08/16 PHP
PHP分页显示的方法分析【附PHP通用分页类】
2018/05/10 PHP
php无限级分类实现评论及回复功能
2019/02/18 PHP
phpstorm激活码2020附使用详细教程
2020/09/25 PHP
js 自制滚动条的小例子
2013/03/16 Javascript
使用insertAfter()方法在现有元素后添加一个新元素
2014/05/28 Javascript
JavaScript是如何实现继承的(六种方式)
2016/03/31 Javascript
js控件Kindeditor实现图片自动上传功能
2020/07/20 Javascript
Bootstrap作品展示站点实战项目2
2016/10/14 Javascript
AngularJS extend用法详解及实例代码
2016/11/15 Javascript
如何清除IE10+ input X 文本框的叉叉和密码输入框的眼睛图标
2016/12/21 Javascript
Ionic2调用本地SQlite实例
2017/04/22 Javascript
Node.js中 __dirname 的使用介绍
2017/06/19 Javascript
JavaScript运行原理分析
2018/02/09 Javascript
小程序云开发部署攻略(图文教程)
2018/10/30 Javascript
vue使用keep-alive保持滚动条位置的实现方法
2019/04/09 Javascript
layui之数据表格--与后台交互获取数据的方法
2019/09/29 Javascript
node.js基础知识汇总
2020/08/25 Javascript
[48:21]Mski vs VGJ.S Supermajor小组赛C组 BO3 第一场 6.3
2018/06/04 DOTA
Python3实现发送QQ邮件功能(文本)
2017/12/15 Python
python Celery定时任务的示例
2018/03/13 Python
遗传算法python版
2018/03/19 Python
python tornado微信开发入门代码
2018/08/24 Python
为什么str(float)在Python 3中比Python 2返回更多的数字
2018/10/16 Python
详解python项目实战:模拟登陆CSDN
2019/04/04 Python
PyQt5高级界面控件之QTableWidget的具体使用方法
2020/02/23 Python
python接口自动化框架实战
2020/12/23 Python
欧舒丹英国官网:购买欧舒丹护手霜等明星产品
2017/01/17 全球购物
递归计算如下递归函数的值(斐波拉契)
2012/02/04 面试题
结构工程研究生求职信
2013/10/13 职场文书
公司年底活动方案
2014/08/17 职场文书
表彰大会新闻稿
2015/07/17 职场文书
go语言中切片与内存复制 memcpy 的实现操作
2021/04/27 Golang