问题如下：
我今天做一个联动下拉框的时候，遇到了一个奇怪的问题，在ready方法里面注册的事件失效了！比如：$("#province"）.change(function(){........})当我改变id为province下拉框的值的时候，这个方法并没有执行！原因如下：
1.html部分代码
<select id="province">
<option value="default">请选择</option>
</select>
<select id="section">
<option value="default">请选择</option>
</select>
<select id="estate" name="id_area">
<option value="default">请选择</option>
</select>
2.部分js代码
$(document).ready(function(){
//发送一个AJAX请求 （获得全国省份信息）
$.ajax({
type:"post",
dataType:"xml",
url:"areaAction.do",
data:"action=getProvince",
success:function(data){
//需要追加的字符串
var appendHtml="";
//循环加载
$(data).find("node").each(function(i){
appendHtml+="<option value='"+$(data).find("node id").eq(i).text()+"'>"
+$(data).find("node name").eq(i).text()+"</option>";
}
)
//追加HTML代码
$("#province").append(appendHtml);
},
error:function(XMLResponse){
alert("获取省份信息失败");
}
});
当加载html页面的时候，我发送了一个AJAX请求，请求获得全国的省份信息。在
<select id="province">
<option value="default">请选择</option>
</select>
之间追加了一些选项。如果不发送这个请求，$("#province"）.change(function(){........})函数就会被触发，但是你一但发送，相当于就改变了id为province的下拉框，以前注册的change事件就失效了！至于原因，我也不是很清楚。不过如果这样写就可以：
$("#province").live("change",function(){.....}）;
live事件API文档解释如下
live( type, fn )
jQuery 1.3中新增的方法。给所有当前以及将来会匹配的元素绑定一个事件处理函数（比如click事件）。也能绑定自定义事件。
目前支持 click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout,
keydown, keypress, keyup。
还不支持 blur, focus, mouseenter, mouseleave, change,
submit
与bind()不同的是，live()一次只能绑定一个事件。
这个方法跟传统的bind很像，区别在于用live来绑定事件会给所有当前以及将来在页面上的元素绑定事件(使用委派的方式)。比如说，如果你给页
面上所有的li用live绑定了click事件。那么当在以后增加一个li到这个页面时，对于这个新增加的li，其click事件依然可用。而无需重新给
这种新增加的元素绑定事件。
|
我的理解就是：无论页面是否会局部刷新，这样绑定的话，这个事件始终有效，而且还对新增加的标签有效果！
分享到：
- 2009-11-20 21:29
- 浏览 5372
- 评论(3)
- 论坛回复 / 浏览 (2 / 2349)
- 查看更多
相关推荐
当使用jQuery库来操作DOM和绑定事件时，如果页面的部分内容是通过AJAX动态加载的，就可能出现事件绑定失效的问题。本知识点将围绕“AJAX更新数据后，jQuery事件失效问题”进行深入探讨。 首先，我们要了解jQuery的...
原生JavaScript监听滚轮事件稍微复杂一些，因为需要考虑浏览器兼容性问题。可以使用`addEventListener`方法添加事件监听器，并处理不同的滚轮事件名称。 ```javascript document.addEventListener('...
然而，这种操作往往伴随着一个挑战：为这些新添加的元素绑定的事件可能无法正常工作，即所谓的“事件失效”问题。这个问题的根源在于事件冒泡机制，即事件从最深的节点向上层节点传播。当动态添加的元素不存在于DOM...
本文将探讨一个特定的场景，即一个 JavaScript 文件导致的 jQuery 失效问题及其解决方案。 首先，我们要理解 jQuery 失效可能的原因。通常，jQuery 失效可能是由于以下几种情况： 1. **jQuery 库未正确引入**：...
标题和描述提到的问题正是这种情况，即使用`append`方法添加含有ID的元素后，与该ID关联的事件失效。 首先，让我们深入理解这个问题。在jQuery中，事件处理通常有两种方式：直接绑定和代理绑定。直接绑定是指直接将...
**jQuery Mobile 常见问题及解决方案** ...总之，理解 jQuery Mobile 的工作原理和事件机制是解决这些问题的关键。在实际开发中，根据项目需求和用户反馈不断调整和优化，才能构建出高效、流畅的移动应用。
然而，当在Dialog中嵌入服务器控件时，可能会遇到一些问题，比如事件处理程序失效。这个问题通常发生在尝试在Dialog内与服务器端控件交互时，例如在DropdownList控件上绑定SelectIndexChanged事件。 首先，我们要...
总结来说，解决jQuery对新插入节点绑定`click`事件失效的问题，主要是通过使用`on`方法进行事件委托，让事件处理程序绑定到不会被动态修改的父元素上，从而确保对新插入的子元素的事件监听有效。当然，要根据实际...
总的来说，解决jQuery `append`添加元素的事件无效问题，关键在于使用`on`方法代替`click`等直接的事件绑定，并将事件处理器绑定到一个固定的、已存在的父元素上，以便处理动态生成的子元素的事件。这种方法不仅解决...
本文将详细讨论“文件编码导致jQuery失效”的问题及其解决方法。 首先，我们要明白编码的作用。编码是计算机处理字符的一种方式，常见的有ASCII、GBK、UTF-8等。不同的编码方式对字符集的支持程度不同，如果编码不...
jQuery打印插件jqprint，jquery.jqprint-0.3.js 下载，内包含使用示例，下载解压可直接在浏览器打开使用。 jQuery打印插件jqprint，jquery.jqprint-0.3.js 下载，内包含使用示例，下载解压可直接在浏览器打开使用。 ...
而jQuery也使用了相同的全局变量，这就导致了冲突，使得在页面中同时使用这两个库时，可能会出现某些功能失效或者错误。 ### 解决方案 1. **使用jQuery.noConflict()** jQuery提供了`noConflict()`方法来释放`$`...
本文主要讨论了在使用jQuery动态添加HTML内容和JavaScript事件绑定时，可能出现的失效问题。具体来说，涉及到以下几个知识点： 1. jQuery动态添加HTML内容：在Web开发中，经常需要动态地向页面中添加新的HTML元素。...
在IT行业中，jQuery是一个广泛使用的JavaScript库，它极大地简化了DOM操作、事件处理、动画制作以及Ajax交互。jQuery的经典例子通常包含对这些功能的演示，帮助开发者更好地理解和应用这个强大的工具。以下是对...
然而，随着jQuery从1.x版本向更高版本升级，一些API的改变可能导致原有的jBox代码失效，特别是涉及到DOM操作和事件处理的部分。 针对jQuery 1.9以上的版本，jBox进行了相应的调整，确保了兼容性。这主要体现在对...
首先，jQuery是一个广泛使用的JavaScript库，它简化了DOM操作、事件处理、动画制作等任务。而jQuery Word Export则是基于jQuery的一个插件，它扩展了jQuery的功能，使其具备了将HTML转换为Word文档的能力。这使得...