Question

我在页面的不同位置有几个按钮。我想在单击鼠标的位置单击按钮上的对话框。以下是在窗口上的定位。如何定位我的按钮鼠标点击位置？

<script type="text/javascript">
    $("[id*=btnPopup]").live("click", function () {
        $("#dialog").dialog({
            dialogClass: "no-close",
            position: { my: "left top", at: "left top", of: window },
            buttons: {
                Close: function () {
                    $(this).dialog('close');
                }
            }
        });
        return false;
    });
</script>

<div id="dialog" style="display: none">
This is a simple popup
</div>
<asp:Button ID="btnPopup" runat="server" Text="Show Popup" />

Answer 1

您可以相对于单击的按钮定位对话框。您还可以通过在left或top中添加或减去来修复排名。看起来应该是这样的：

$('body').on('click', '.btn', function () {
    var $btn = $(this);
    $("#dialog").dialog({
        dialogClass: "no-close",
        position: { my: "left top", at: "left top", of: $btn },
        buttons: {
            Close: function () {
                $(this).dialog('close');
            }
        }
    });
})

.btn {
    margin: 100px 300px
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<link href='https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css' rel="stylesheet" ></link>

<button class="btn">Button</button>
<div id="dialog" style="display: none">
        This is a simple popup
</div>

在ASP.Net C＃中点击按钮单击对话框

1 个答案: