我试图在 asp.net 页面上单击按钮后显示模态弹出窗口。
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="TestFile.ascx.cs" Inherits="TestFile" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ Import Namespace="System.IO" %>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>jQuery UI Example Page</title>
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.21.custom.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.21.custom.min.js"></script>
<script type="text/javascript">
function fnmodalpopup() {
$( "#dialog-modal" ).dialog({
height: 140,
modal: true
});
</script>
</head>
<!--Misc functions for operations -->
<script runat="server" type="text/javascript">
</script>
<div id="dialog-modal" title="Basic modal dialog">
<p>Adding the modal overlay screen makes the dialog look more prominent because it dims out the page content.</p>
</div>
<asp:Button ID="Button1" runat="server" Text="Button" />
我正在尝试创建一个与 http://jqueryui.com/demos/dialog/#modal 完全相同的对话框,但通过单击按钮以 asp.net 表单触发。页面闪烁,但什么也没有出现。
任何反馈都会非常有帮助!
最佳答案
您应该使用 OnClientClick 事件,然后通过 return false 来阻止回发,如下所示:
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="return fnmodalpopup()" />
function fnmodalpopup() {
$( "#dialog-modal" ).dialog({
height: 140,
modal: true
});
return false;
});
编辑:
我更改了 OnClientClick="return fnmodalpopup()"
现在它工作正常(至少当我测试它时)。
只是好奇,如果您不想创建回发,为什么要使用服务器端组件?如果没有该按钮必须进行回发的情况,也许使用 html 按钮标签(或任何其他 html 标签并使用 jQuery 捕获“click”事件)会更好。如果您在页面的其余部分使用 asp.net 控件也没关系。
关于JQuery 模态弹出窗口,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11637642/