Question

我使用了这个Plugin in Webforms。我的表格上有内容地点持有人，因此我将代码转换为下面的内容：

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
    $(function() {
    $('#<%=dialog.ClientID %>').dialog({
            autoOpen: false,
            show: {
                effect: "blind",
                duration: 1000
            },
            hide: {
                effect: "explode",
                duration: 1000
            }
        });
        $('#<%=opener.ClientID %>').click(function() {
        $('#<%=dialog.ClientID %>').dialog("open");
        });
    });
</script>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

<div id="dialog" runat="server" title="Basic dialog">
<p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>
<button runat="server" id="opener">Open Dialog</button>


</asp:Content>

但它不起作用。我该如何解决这个问题？

Answer 1

<button>元素在单击后将页面提交回服务器。这是表单中的默认行为（Webforms页面是表单），这就是您无法看到对话框的原因。

您可以像这样在按钮中添加type="button"：

<button runat="server" type="button" id="opener">Open Dialog</button>

它会阻止按钮将页面发布回服务器，您将能够看到对话框。

webforms中的Jquery对话框

1 个答案: