c#jquery简单对话框_C#_Jquery_Asp.net_Webforms

c#jquery简单对话框

c# jquery asp.net

c#jquery简单对话框,c#,jquery,asp.net,webforms,C#,Jquery,Asp.net,Webforms,我不熟悉C#和JQuery。我尝试将jquery添加到一个C#WebForm项目中。我想做的是：将按钮添加到Web窗体。如果在服务器端单击该按钮，则显示JQuery对话框这是我的代码-如果我点击按钮，什么都不会发生。我想知道问题出在哪里 .aspx文件： <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="frmMain.aspx.cs" Inherits="Dialog_YES_NO_mit_JQuery.frmM

我不熟悉C#和JQuery。我尝试将jquery添加到一个C#WebForm项目中。我想做的是：将按钮添加到Web窗体。如果在服务器端单击该按钮，则显示JQuery对话框

这是我的代码-如果我点击按钮，什么都不会发生。我想知道问题出在哪里

.aspx文件：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="frmMain.aspx.cs" Inherits="Dialog_YES_NO_mit_JQuery.frmMain" %>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

  <title></title>

    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js' type="text/javascript"></script>        

    <script type="text/javascript">
    function ShowPopup(message) {
        $(function () {
            $("#dialog").html(message);
            $("#dialog").dialog({
                title: "jQuery Dialog Popup",
                buttons: {
                    Close: function () {
                        $(this).dialog('close');
                    }
                },
                modal: true
            });
        });
    };
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>

        Dialogbox using JQuery<br />
        <br />
        <asp:Button ID="btnDemo1" runat="server" OnClick="btnDemo1_Click" Text="Demo1" />
        <br />

    </div>
    </form>
</body>
</html>

下面是一个适合我的例子：

代码隐藏：

    protected void ShowDialogClick(object sender, EventArgs e)
    {
        ScriptManager.RegisterClientScriptBlock(this.Page, this.GetType(), Guid.NewGuid().ToString(), "ShowDialogJS();", true);
    }

aspx：

<script type="text/javascript">

    function ShowDialogJS() {
        jQuery("#dialog").dialog();
    }
</script>


<asp:Button runat="server" ID="btnShowDialog" Text="Show Dialog"
            OnClick="ShowDialogClick"></asp:Button>


函数ShowDialogJS（）{
jQuery（“#dialog”）.dialog（）；
}

编辑：我有两个用于jQuery的js文件：

    <script src="ressources/jQuery/scripts/jquery-1.11.4.js" type="text/javascript"></script>
    <script src="ressources/jQuery/scripts/jquery-ui-1.11.4.js" type="text/javascript"></script>

下面是一个适合我的示例：

代码隐藏：

    protected void ShowDialogClick(object sender, EventArgs e)
    {
        ScriptManager.RegisterClientScriptBlock(this.Page, this.GetType(), Guid.NewGuid().ToString(), "ShowDialogJS();", true);
    }

aspx：

<script type="text/javascript">

    function ShowDialogJS() {
        jQuery("#dialog").dialog();
    }
</script>


<asp:Button runat="server" ID="btnShowDialog" Text="Show Dialog"
            OnClick="ShowDialogClick"></asp:Button>


函数ShowDialogJS（）{
jQuery（“#dialog”）.dialog（）；
}

编辑：我有两个用于jQuery的js文件：

    <script src="ressources/jQuery/scripts/jquery-1.11.4.js" type="text/javascript"></script>
    <script src="ressources/jQuery/scripts/jquery-ui-1.11.4.js" type="text/javascript"></script>

试试这个 aspx


使用JQuery的对话框

增加

我还添加了javascirpt文件

试试这个 aspx


使用JQuery的对话框

增加

我还添加了javascirpt文件

以下是一个完整的示例：

您需要在对jQuery的引用之后添加对jQuery UI库的引用，因为这是定义对话框逻辑的地方

您需要添加对jQueryUICSS文件的引用以启用模式弹出样式


功能显示弹出窗口（消息）{
$（函数（）{
$（“#dialog”）.html（消息）；
$（“#对话框”）。对话框({
标题：“jQuery对话框弹出”，
按钮：{
关闭：函数（）{
$（this.dialog（'close'）；
}
},
莫代尔：对
});
});
};
使用JQuery的对话框



以下是一个完整的示例：
您需要在对jQuery的引用之后添加对jQuery UI库的引用，因为这是定义对话框逻辑的地方
您需要添加对jQueryUICSS文件的引用以启用模式弹出样式



功能显示弹出窗口（消息）{
$（函数（）{
$（“#dialog”）.html（消息）；
$（“#对话框”）。对话框({
标题：“jQuery对话框弹出”，
按钮：{
关闭：函数（）{
$（this.dialog（'close'）；
}
},
莫代尔：对
});
});
};
使用JQuery的对话框



参考此链接>参考此链接>我重新编辑我的答案。。抱歉，将$（“#dialog”）替换为jQuery（“#dialog”）。。这里有一个没有调用代码的示例：我重新编辑我的答案。。抱歉，将$（“#dialog”）替换为jQuery（“#dialog”）。。下面是一个没有调用代码隐藏的示例：