在jQuery Alert Dialogs (Alert, Confirm, & Prompt Replacements)(翻译)发布后,受到大家的很多鼓励,在这里先感谢大家。
在昨天lastwinter留言关于jConfirm的问题,如下
我趁今天有空就考虑了下。我觉得lastwinter问这个问题应该是关于ASP.NET的回传问题,这主要是jConfirm这个为CallBack回调,
他是异步的,并非同步。所以我尝试了下阻止事件的冒泡,并当选择为true是自动回传。用LinkButton测试(Button不同于这个解决的方案在后面解释)
现贴出LinkButton的CODE DEMO:
- 关于jConfirm回传DEMO
- <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
- <!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">
- <head runat="server">
- <title></title>
- <script src="Script/jquery-1.3.2.min.js" type="text/javascript"></script>
- <script src="Script/jquery.alerts-1.1/jquery.alerts.js" type="text/javascript"></script>
- <link href="Script/jquery.alerts-1.1/jquery.alerts.css" rel="stylesheet" type="text/css" />
- </head>
- <body>
- <form id="form1" runat="server">
- <asp:LinkButton ID="LinkButton1" runat="server" >LinkButton</asp:LinkButton>
- <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
- <div>
- </div>
- </form>
- <script type="text/javascript">
- $(document).ready(function() {
- $("#<%=LinkButton1.ClientID %>").click(function(event) {
- jConfirm("test", "test jconfirm", function(r) {
- if (r) {
- <%= Page.ClientScript.GetPostBackClientHyperlink(LinkButton1,"") %>
- }
- });
- event.stopPropagation();
- event.preventDefault();
- });
- });
- </script>
- </body>
- </html>
- LinkButton1 Button Click CODE
- protected void Button1_Click(object sender, EventArgs e)
- {
- this.Label1.Text = DateTime.Now.ToString();
- }
要为先阻止事件的冒泡event.stopPropagation();event.preventDefault(); 在jConfirm的callback回调函数中判断是否需要回传,
<%= Page.ClientScript.GetPostBackClientHyperlink(LinkButton1,"") %>;;
点击LinkButton1是效果为:
点击Cancel时候就不会回传,当ok时候就会发生回传更新时间:
对于我们的LinkButton的实现是在输出的客户端Html代码有脚本自动回传,而Button这是HTML元素submit,提交,
所以在这两个的区别下,LinkButton就多了几处javascript 代码:
- <script type="text/javascript">
- //<![CDATA[
- var theForm = document.forms['form1'];
- if (!theForm) {
- theForm = document.form1;
- }
- function __doPostBack(eventTarget, eventArgument) {
- if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
- theForm.__EVENTTARGET.value = eventTarget;
- theForm.__EVENTARGUMENT.value = eventArgument;
- theForm.submit();
- }
- }
- //]]>
- </script>
- 和 input Hidden
- <input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
- <input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
上面所说的意思就是如果要用Button实现同样的示例,我们必须保证我的输出客户端的代码有这些回传脚本注册,还有就是回传为
<%=Page.ClientScript.GetPostBackEventReference(Button1,"") %>。所以我觉得用LinkButton更适合。
本文转自 破狼 51CTO博客,原文链接:http://blog.51cto.com/whitewolfblog/834341,如需转载请自行联系原作者