当用户悬停页面的某些元素时,我正在使用 jQuery 提示插件来显示帮助提示。
我需要在使用 css 选择器加载页面后注册插件事件。
问题是我使用的是 ASP.NET 更新面板,在第一次回发后,提示停止工作,因为更新面板替换了页面内容但没有重新绑定 javascript 事件。
我需要一种在更新面板刷新其内容后执行 javascript 回调的方法,以便我可以重新绑定 javascript 事件以使提示再次工作。
有没有办法做到这一点?
当用户悬停页面的某些元素时,我正在使用 jQuery 提示插件来显示帮助提示。
我需要在使用 css 选择器加载页面后注册插件事件。
问题是我使用的是 ASP.NET 更新面板,在第一次回发后,提示停止工作,因为更新面板替换了页面内容但没有重新绑定 javascript 事件。
我需要一种在更新面板刷新其内容后执行 javascript 回调的方法,以便我可以重新绑定 javascript 事件以使提示再次工作。
有没有办法做到这一点?
不要把你的 jQuery 代码放在 里面,而是$(document).ready()
把它放在里面
function pageLoad(sender, args) {
...
}
pageLoad
在每次回发后执行,同步或异步。pageLoad
是 ASP.NET AJAX 中用于此目的的保留函数名称。$(document).ready()
另一方面,当 DOM 最初准备好/加载时只执行一次。
pageLoad 不起作用。我用这个代替:
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_pageLoaded(pageLoaded);
function pageLoaded() {
}
这可能远不是最优雅的解决方案,但它仍然是一个解决方案:
public class UpdatePanel : System.Web.UI.UpdatePanel
{
/// <summary>
/// Javascript to be run when the updatepanel has completed updating
/// </summary>
[Description("Javascript to be run when the updatepanel has completed updating"),
Category("Values"),
DefaultValue(null),
Browsable(true)]
public string OnUpdateCompleteClientScript
{
get
{
return (string)ViewState["OnUpdateCompleteClientScript"];
}
set
{
ViewState["OnUpdateCompleteClientScript"] = value;
}
}
protected override void OnPreRender(System.EventArgs e)
{
base.OnPreRender(e);
if(!string.IsNullOrEmpty(this.OnUpdateCompleteClientScript))
Page.ClientScript.RegisterStartupScript(this.GetType(), this.ClientID, string.Concat("Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(sender, args){for(var panelId in sender._updatePanelClientIDs){if(sender._updatePanelClientIDs[panelId] == '", this.ClientID, "'){", this.OnUpdateCompleteClientScript, "}}});"), true);
}
}
像这样使用它:
<uc:UpdatePanel OnUpdateCompleteClientScript="alert('update complete');">
<!-- stuff in here -->
</uc:UpdatePanel>
当然,您需要在 webconfig 或页面中注册自定义控件才能像这样使用它。
编辑:还有,你看过jquery.live 吗?
如果你想在 UpdatePanel 加载之前和之后做特定的操作,你可以像这样覆盖BeginPostbackRequest
和EndPostbackRequest
:
var postbackControl = null;
var updatePanels = null;
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_beginRequest(BeginPostbackRequest);
prm.add_endRequest(EndPostbackRequest);
function BeginPostbackRequest(sender, args) {
prm._scrollPosition = null;
postbackControl = args.get_postBackElement();
postbackControl.disabled = true;
updatePanels = args._updatePanelsToUpdate;
// do your stuff
}
function EndPostbackRequest(sender, args) {
// do your stuff
postbackControl.disabled = false;
postbackControl = null;
updatePanels = null;
}
如果您只想处理更新面板提供的 HTML,这非常方便。某些操作需要更多资源,在pageLoad
.
使用 pageLoaded 事件并检查是否回调或回发:
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_pageLoaded(function (sender, args) {
if (args._panelsUpdated && args._panelsUpdated.length > 0) {
//callback;
}
else {
//postback;
}
});