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 相关文章推荐
javascript基础的动画教程,直观易懂
Jan 10 Javascript
设置iframe的document.designMode后仅Firefox中其body.innerHTML为br
Feb 27 Javascript
分享精心挑选的12款优秀jQuery Ajax分页插件和教程
Aug 09 Javascript
js随机生成26个大小写字母
Feb 12 Javascript
jQuery搜索框效果实现代码(百度关键词联想)
Feb 25 Javascript
Vue.js组件使用开发实例教程
Nov 01 Javascript
详解a++和++a的区别
Aug 30 Javascript
微信小程序左右滑动的实现代码
Dec 15 Javascript
解决vue 按钮多次点击重复提交数据问题
May 10 Javascript
详解webpack自定义loader初探
Aug 29 Javascript
利用Promise自定义一个GET请求的函数示例代码
Mar 20 Javascript
JS函数参数的传递与同名参数实例分析
Mar 16 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/03 咖啡文化
PHP多个版本的分析解释
2011/07/21 PHP
php获得文件大小和文件创建时间的方法
2015/03/13 PHP
扩展jQuery 键盘事件的几个基本方法
2009/10/30 Javascript
JQuery获取文本框中字符长度的代码
2011/09/29 Javascript
主页面中的两个iframe实现鼠标拖动改变其大小
2013/04/16 Javascript
如何实现修改密码时密码框显示保存到cookie的密码
2013/12/10 Javascript
用JavaScript实现用一个DIV来包装文本元素节点
2014/09/09 Javascript
原生javascript实现Tab选项卡切换功能
2015/01/12 Javascript
JavaScript数组迭代器实例分析
2015/06/09 Javascript
JS实现仿苹果底部任务栏菜单效果代码
2015/08/28 Javascript
浅谈javascript的call()、apply()、bind()的用法
2016/02/21 Javascript
jQuery中通过ajax的get()函数读取页面的方法
2016/02/29 Javascript
基于jQuery实现页面搜索功能
2020/03/26 Javascript
js实现表单及时验证功能 用户信息立即验证
2016/09/13 Javascript
详解React Native 采用Fetch方式发送跨域POST请求
2017/11/15 Javascript
vue-router 源码实现前端路由的两种方式
2018/07/02 Javascript
layer插件select选中默认值的方法
2018/08/14 Javascript
移动端图片上传旋转、压缩问题的方法
2018/10/16 Javascript
微信网页登录逻辑与实现方法
2019/04/29 Javascript
js获取 gif 的帧数的代码实例
2019/09/10 Javascript
[03:49]显微镜下的DOTA2第十五期—VG登基之路完美团
2014/06/24 DOTA
python编写网页爬虫脚本并实现APScheduler调度
2014/07/28 Python
wxPython窗口中文乱码解决方法
2014/10/11 Python
Python切片知识解析
2016/03/06 Python
numpy中实现二维数组按照某列、某行排序的方法
2018/04/04 Python
pandas DataFrame 交集并集补集的实现
2019/06/24 Python
Python之虚拟环境virtualenv,pipreqs生成项目依赖第三方包的方法
2019/07/23 Python
利用python生成照片墙的示例代码
2020/04/09 Python
python 输入字符串生成所有有效的IP地址(LeetCode 93号题)
2020/10/15 Python
matplotlib之pyplot模块坐标轴标签设置使用(xlabel()、ylabel())
2021/02/22 Python
自我评价范文分享
2014/01/04 职场文书
文科毕业生自荐书范文
2014/04/17 职场文书
上课随便讲话检讨书
2014/09/12 职场文书
Python insert() / append() 用法 Leetcode实战演示
2021/03/31 Python
浅谈Redis位图(Bitmap)及Redis二进制中的问题
2021/07/15 Redis