jquery绑定事件不生效的解决方法


Posted in Javascript onFebruary 11, 2014

今天在开发前台页面时发现jquery绑定click事件,怎么都不生效。代码如下:
1.html:<input id="ceshisub" type="button" value="单击事件" >
2.html引用的test.js中的方法函数:

$("#ceshisub").bind("click",function(){ 
var a=1; 
a +=1; 
alert("ceshisub"); 
});

出现的问题就是在页面中点解“单击事件”按钮没有任何反应,打开js调试窗口在var a=1;这一行打的断点没有进来。
解决的办法是:
一、在上述js函数上添加加载事件:
添加后的代码如下:
$(function(){ 
$("#ceshisub").bind("click",function(){ 
var a=1; 
a +=1; 
alert("ceshisub"); 
}); 
});

这样的话,绑定事件就生效了。
js的加载函数共有三个,除了上述的
$(function(){ 
alert("第1种方法。"); 
});

还有以下两个方法:
window.onload=function(){ 
alert("第2种方法。"); 
} $(document).ready(function(){ 
alert("第3种方法。"); 
});

二、如果不采用js加载函数来对绑定事件进行初始化的话还有一个方法:
将引用js的语句
<script language="javascript" src="/js/test.js"></script>
放到页面的最后面进行加载。

总结:
jquery在元素上A绑定事件时,首先会在docment中查找该元素A,如果没有找到则绑定失败。
上面第一个解决方式是在页面初始化后,在初始化js时在进行绑定
第二个方式就是先要保证页面元素都初始化完成后,在去进行绑定,这时所有的元素都已将初始化完成,肯定能绑定上。

Javascript 相关文章推荐
javascript操作文本框readOnly
May 15 Javascript
Extjs407 getValue()和getRawValue()区别介绍
May 21 Javascript
jquery中文乱码的多种解决方法
Jun 21 Javascript
Knockout visible绑定使用方法
Nov 15 Javascript
IE6 hack for js 集锦
Sep 23 Javascript
JavaScritp添加url参数并将参数加入到url中及更改url参数的方法
Oct 26 Javascript
JavaScript中校验银行卡号的实现代码
Dec 19 Javascript
浅谈React和Redux的连接react-redux
Dec 04 Javascript
vue项目部署到Apache服务器中遇到的问题解决
Aug 24 Javascript
了解Javascript中函数作为对象的魅力
Jun 19 Javascript
微信小程序实现商城倒计时
Nov 01 Javascript
Vant 在vue-cli 4.x中按需加载操作
Nov 05 Javascript
JS将制定内容复制到剪切板示例代码
Feb 11 #Javascript
JS创建自定义表格具体实现
Feb 11 #Javascript
js实现div的切换特效上一个下一个
Feb 11 #Javascript
js中文逗号转英文实现
Feb 11 #Javascript
JS自调用匿名函数具体实现
Feb 11 #Javascript
js跳转页面方法实现汇总
Feb 11 #Javascript
jQuery实现div浮动层跟随页面滚动效果
Feb 11 #Javascript
You might like
php中记录用户访问过的产品,在cookie记录产品id,id取得产品信息
2011/05/04 PHP
rrmdir php中递归删除目录及目录下的文件
2011/05/15 PHP
新手学习PHP的一些基础知识分享
2011/07/27 PHP
php数组函数序列之in_array() 查找数组值是否存在
2011/10/29 PHP
php读取txt文件组成SQL并插入数据库的代码(原创自Zjmainstay)
2012/07/31 PHP
PHP生成唯一的促销/优惠/折扣码(附源码)
2012/12/28 PHP
实例分析10个PHP常见安全问题
2019/07/09 PHP
使用JS获取当前地理位置方法汇总
2014/12/18 Javascript
Jquery跨浏览器文本复制插件Zero Clipboard的使用方法
2016/02/28 Javascript
jQuery实现ajax的叠加和停止(终止ajax请求)
2016/08/08 Javascript
妙用Bootstrap的 popover插件实现校验表单提示功能
2016/08/29 Javascript
Angular.js去除页面中显示的空行方法示例
2017/03/30 Javascript
浅谈vue引用静态资源需要注意的事项
2018/09/28 Javascript
详解在vue-test-utils中mock全局对象
2018/11/07 Javascript
详解vue-template-admin三级路由无法缓存的解决方案
2020/03/10 Javascript
使用Vue Composition API写出清晰、可扩展的表单实现
2020/06/10 Javascript
[00:03]DOTA2新版本PA至宝展示
2014/11/19 DOTA
用Python编写一个简单的FUSE文件系统的教程
2015/04/02 Python
python脚本替换指定行实现步骤
2017/07/11 Python
Python获取本机所有网卡ip,掩码和广播地址实例代码
2018/01/22 Python
python批量实现Word文件转换为PDF文件
2018/03/15 Python
Python3连接SQLServer、Oracle、MySql的方法
2018/06/28 Python
Python对Excel按列值筛选并拆分表格到多个文件的代码
2019/11/05 Python
Python3.x+迅雷x 自动下载高分电影的实现方法
2020/01/12 Python
对pytorch的函数中的group参数的作用介绍
2020/02/18 Python
CSS3 3D酷炫立方体变换动画的实现
2019/03/26 HTML / CSS
Volcom英国官方商店:美国殿堂级滑板、冲浪、滑雪服装品牌
2019/03/13 全球购物
金山毒霸系列的笔试题
2013/04/13 面试题
护士辞职信范文
2014/01/19 职场文书
文秘求职信范文
2014/04/10 职场文书
物联网工程专业推荐信
2014/09/08 职场文书
2016简历自荐信优秀范文
2016/01/29 职场文书
2016年暑期社会实践活动总结报告
2016/04/06 职场文书
解决Go gorm踩过的坑
2021/04/30 Golang
SQL Server Agent 服务无法启动
2022/04/20 SQL Server
如何解决flex文本溢出问题小结
2022/07/15 HTML / CSS