在asp.net mvc 4和VS2010中使用jqueryUI打开模态窗口

本文关键字：jqueryUI 窗口 模态 net asp mvc VS2010 | 更新日期: 2023-09-27 18:12:17

我试图打开一个模态窗口在我的asp.net mvc 4项目点击链接。我所写的代码没有发生任何事情。我错过了什么?我已经在我的网站主中引用了这些链接。

<link type="text/css" href="@Url.Content("~/Content/custom.css")" rel="Stylesheet" />   
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery-1.9.1.js")" ></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/jquery-ui-1.10.3.custom.min.js")"></script>

我的代码

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/SiteMaster.cshtml";
}

<div id="dialogMsg" title="I'm Title of dialog">
            Hello I'm dialog body.
</div>

<a href="#" id="thelink">Open Dialog</a>

<script type="text/javascript">

    $(document).ready(function () {

        $("#dialogMsg").dialog({
            autoOpen: false,
            height: 300,
            width: 350,
            modal: true,
            buttons: {
                "Do something": function () {
                    var bValid = true;
                    $(this).dialog("close");
                },
                Cancel: function () {
                    $(this).dialog("close");
                }
            },
            close: function () {
                allFields.val("").removeClass("ui-state-error");
            }
        });


        $('#thelink')
        .click(function () {
            $('dialogMsg').dialog('open');
        });
    });
</script>

在asp.net mvc 4和VS2010中使用jqueryUI打开模态窗口

您错过了实际打开对话框的选择器上的#。在这里看到的:

$('#thelink')
    .click(function () {
        $('dialogMsg').dialog('open');
    });

改为:

$('#thelink')
    .click(function () {
        $('#dialogMsg').dialog('open');
    });
相关文章：