我正在使用jQuery在UpdatePanel内的元素上连接一些鼠标悬停效果。事件绑定在$(document)中。准备好了。例如:
$(function() {
$('div._Foo').bind("mouseover", function(e) {
// Do something exciting
});
});
当然,这在页面第一次加载时工作得很好,但是当UpdatePanel进行部分页面更新时,它不会运行,鼠标悬停效果在UpdatePanel内部也不再工作。
在第一个页面加载时,以及每次UpdatePanel触发部分页面更新时,建议使用什么方法来连接jQuery中的内容?我应该使用ASP。NET ajax生命周期代替$(document).ready?
jQuery在UpdatePanel中的用户控件
这不是对问题的直接回答,但我确实通过阅读我在这里找到的答案把这个解决方案组合在一起,我想有人可能会觉得它有用。
我试图在用户控件中使用jQuery文本区域限制器。这很棘手,因为用户控件运行在UpdatePanel内部,并且在回调时丢失了绑定。
如果这只是一个页面,这里的答案将直接适用。但是,用户控件不能直接访问head标签,也不能像一些答案假设的那样直接访问UpdatePanel。
我最终把这个脚本块放在我的用户控件的标记的顶部。对于初始绑定,它使用$(document)。准备好了,然后使用prm。add_endRequest从那里:
<script type="text/javascript">
function BindControlEvents() {
//jQuery is wrapped in BindEvents function so it can be re-bound after each callback.
//Your code would replace the following line:
$('#<%= TextProtocolDrugInstructions.ClientID %>').limit('100', '#charsLeft_Instructions');
}
//Initial bind
$(document).ready(function () {
BindControlEvents();
});
//Re-bind for callbacks
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(function() {
BindControlEvents();
});
</script>
所以…我只是想让某人知道这个方法有用。
我的回答是基于上面所有专家的评论,但下面是以下代码,任何人都可以使用它来确保在每次回发和每次异步回发时JavaScript代码仍然会被执行。
在我的例子中,我在页面中有一个用户控件。只需将下面的代码粘贴到用户控件中。
<script type="text/javascript">
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest(EndRequestHandler);
function EndRequestHandler(sender, args) {
if (args.get_error() == undefined) {
UPDATEPANELFUNCTION();
}
}
function UPDATEPANELFUNCTION() {
jQuery(document).ready(function ($) {
/* Insert all your jQuery events and function calls */
});
}
UPDATEPANELFUNCTION();
</script>