单击链接时显示模态？模态对话框不显示？

Question

我有链接下载文件，这个过程有时很长，所以我想要一个JQ模式对话框来显示通知用户下载正在进行。

使用JQuery模式：http://jqueryui.com/demos/dialog/#modal

@model MvcResComm.Models.FileList

@{
    ViewBag.Title = "Download";
}

<script src="../../Scripts/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.20.min.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.23.custom.min.js" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(function () {
        $('a').click(function () {
            $("#dialog-modal").dialog({
                height: 140,
                modal: true
            }, 'open');
        });
    });
</script>

<h2>Download</h2>

<table>
@foreach (KeyValuePair<string, string> item in Model.Files) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.Value)
        </td>
        <td>
            @Html.ActionLink("Download", "DownloadFile", new { fileid = item.Key, token = Model.Token, platform = "windows" })
        </td>
    </tr>
}

</table>
<div id="dialog-modal" title="Basic modal dialog">
    <p>Download in progress.</p><span class="loading">&nbsp;</span>
</div>

Answer 1

您正在使用JQuery 1.8和jQuery UI 1.8.20。

看来你至少需要jQuery UI 1.8.22。

DEMO - 使用jQuery 1.8和jQuery UI 1.8.20

（使用ajax.aspnetcdn.com/ajax/jquery.ui/1.8.20/jquery-ui.js）

以上演示导致错误，您可以在控制台中看到：
TypeError: match is undefined: return !!$.data( elem, match[ 3 ]);

DEMO - 使用jQuery 1.8和jQuery UI 1.8.22

（使用ajax.aspnetcdn.com/ajax/jquery.ui/1.8.22/jquery-ui.js）

如果您在使用jQuery UI 1.8.22时遇到问题，那么您的自定义jQuery 1.8.23文件可能会干扰某些内容。