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

今天在开发前台页面时发现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时在进行绑定
第二个方式就是先要保证页面元素都初始化完成后，在去进行绑定，这时所有的元素都已将初始化完成，肯定能绑定上。

赞 (0)

相关推荐

  • 浅谈jQuery添加的HTML,JS失效的问题

    浅谈jQuery添加的HTML,JS失效的问题

    如下图所示, 点击添加后,会新添加一行,但是二级联动就失效了, $('.provinceList').live('change', function(){ var provinceId = $(this).val(); var obj = $(this); $.post('/yuyue/ajaxCityList', {'provinceId':provinceId}, function(list){ var data = eval( '(' + list + ')' ); if( data .

  • jQuery在html有效在jsp无效的原因及解决方法

    最近用jQuery来写下拉框的选项值的左右移动,代码如下: 复制代码 代码如下: <!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"> <he

  • js和jquery使按钮失效为不可用状态的方法

    设置disabled属性为true即为不可用状态. JS: 复制代码 代码如下: document.getElementByIdx("btn").disabled=true; jquery 复制代码 代码如下: $("#btn").attr("disabled", true); html: 复制代码 代码如下: <input type="button" value="提交" id="btn&

  • Jquery修改页面标题title其它JS失效的解决方法

    Jquery代码 复制代码 代码如下: $("title").html("hello"); 后来只好用下面这段js代码来实现 Js代码 复制代码 代码如下: document.title="hello";

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

    今天在开发前台页面时发现jquery绑定click事件,怎么都不生效.代码如下: 1.html:<input id="ceshisub" type="button" value="单击事件" > 2.html引用的test.js中的方法函数: 复制代码 代码如下: $("#ceshisub").bind("click",function(){ var a=1; a +=1; alert(&quo

  • 浅谈jQuery绑定事件会叠加的解决方法和心得总结

    关于jQuery的学习中我忽略了一个取消绑定事件.unbind()的使用,也不知道绑定事件会累加的情况,结果因为这个原因,让我在项目上栽了坑.只能说自己还太年轻,需要学习掌握的知识还有很多. 我遇到的问题 我在项目中遇到的状况,一个评价页面,简单的来说就是左右两个表格,ajax分别动态加载学生姓名学号信息和不同科目对学生评价内容两部分,两边表格我都每行写了checkbox并对table tbody tr绑定click事件执行行选功能,起初我写的是静态页面html,行选功能完全没有问题,后来换成j

  • 关于jquery中动态增加select,事件无效的快速解决方法

    近来做项目,用的jquery1.6.2库,当动态增加div 及select时,事件却不起作用. 查了一些资料,发现bind事件:向匹配元素附加一个或更多事件处理器.而live事件:为当前或未来的匹配元素添加一个或多个事件处理器. 其资料如下: [bind和live的区别] live方法其实是bind方法的变种,其基本功能就同bind方法的功能是一样的,都是为一个元素绑定某个事件,但是bind方法只能给当前存在的元素绑定事件,对于事后采用JS等方式新生成的元素无效,而live方法则正好弥补了bin

  • 解决Vue router-link绑定事件不生效的问题

    解决方法:加native <router-link to="/date" @click.native="nav_click">最新</router-link> methods: { nav_click: function() { console.log(1) } } 解释: 1: 因为它是自定义标签,根本就没有事件和方法,所以不触发,加个native 就是告诉vue 这个标签现在有主了 它是H5标签 可以加事件了. 2:父组件要想在子组件监听

  • JQuery选择器绑定事件及修改内容的方法

    本文实例讲述了JQuery选择器绑定事件及修改内容的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Hello World jQuery!</title> <script type="text/javascript" src="jquery-1.3.2.min.js&

  • jQuery中checkbox反复调用attr('checked', true/false)只有第一次生效的解决方法

    本文实例讲述了jQuery中checkbox反复调用attr('checked', true/false)只有第一次生效的解决方法.分享给大家供大家参考,具体如下: 先看如下代码: /** * 全选 */ function checkAll() { $("input[name=ids]").attr("checked", true); } /** * 全不选 */ function uncheckAll() { $("input[name=ids]&quo

  • jQuery中checkbox反复调用attr('checked', true/false)只有第一次生效的解决方法

    本文实例讲述了jQuery中checkbox反复调用attr('checked', true/false)只有第一次生效的解决方法.分享给大家供大家参考,具体如下: 先看如下代码: /** * 全选 */ function checkAll() { $("input[name=ids]").attr("checked", true); } /** * 全不选 */ function uncheckAll() { $("input[name=ids]&quo

  • 多种jQuery绑定事件的实现方式

    最近发现jQuery一个对象的事件可以重复绑定多次,当事件触发的时候会引起代码多遍执行. 下面是一个click事件被重复绑定的示例: function reg_button_click(){ $("#button).click(function(){ alert("button click"); }); } $(document).ready(function(){ #重复注册3次 reg_button_click(); reg_button_click(); reg_but

  • jQuery绑定事件监听bind和移除事件监听unbind用法实例详解

    本文实例讲述了jQuery绑定事件监听bind和移除事件监听unbind用法.分享给大家供大家参考,具体如下: 这里分别采用后bind(eventType,[data],Listener)//data为可选参数,one()该方法绑定的事件触发一次后自动删除,unbind(eventType,Listener), 实例: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w

  • 动态生成的DOM不会触发onclick事件的原因及解决方法

    最近朋友在做一个项目的时候,遇到动态加载微博内容,然后点击"展开评论"后获取该微博的所有评论.这里使用了动态加载的<span mid='123456789′ class='get_comment'>点击加载评论</span>. 然后再写 $(".get_comment).click(function(){ //响应事件逻辑 }) 发现click事件并不会触发,使用控制台侦听也木有错误.百思不得其解时, 因为我在以前做搜狐家居商城的运费管理时,也曾遇到,

随机推荐