在ASP.NETMVC中使用JQuery弹出表单

我正在尝试打开一个联系人表单，如下图所示，一旦用户单击asp.net mvc查看页面中的链接或按钮

这是index.cshtml查看页面

       @{       
       Layout = "~/Views/Shared/_Right_upper_Layout.cshtml";
        }

       <a class="openDialog" data-dialog-id="emailDialog" data-dialog-title="contactus" href="~/Home/ContactUs">Contact US</a>

<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript">
</script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.js")" type="text/javascript">
</script>
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript">
</script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript">
</script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript">
</script>

<script type="text/javascript">

    $.ajaxSetup({ cache: false });

    $(document).ready(function () {

        $(".openDialog").live("click", function (e) {    
            e.preventDefault();    
            $("<div></div>")    
            .addClass("dialog")    
            .attr("id",$(this).attr("data-dialog-id"))    
            .appendTo("body")    
            .dialog({    
                title: $(this).attr("data-dialog-title"),
                close: function () { $(this).remove() },
                modal: true    
            })

            .load(this.href);
        });
    });
</script>


@section Scripts 
{}

这是ContactUs.cshtml页面

<label for="Name">Name:</label><br />

<input id="Namecontact" name="Name" type="text" /><br />

<label for="email">Email:</label><br />

<input id="emailcontact" name="email" type="text" /><br />

<label for="message">Message:</label><br />

<textarea id="messagecontact" name="message"></textarea>

<input class="close" name="submit" type="submit" value="Submit" />

名称：



电子邮件：



消息：

---

但是一旦我点击这个ContactUs它的“打开新选项卡”而不是弹出窗口，这里有什么问题。

尝试将您的

jquery

文件更新到最新版本，并检查您的控制台中是否有任何错误browser@GuruprasadRao我有以下哪一个我应该选择，这听起来像是您的脚本没有启动，您只是重定向到

Home/ContactUs

。在脚本中放入

console.log（）

语句以检查其命中情况。@StephenMuecke这样放置

$（“.openDialog”）.live（“单击”，函数（e）{.console.log（）..

然后我检查了console错误，但没有该视图中的错误。您需要在它旁边放一些东西，以显示一条您可以检查的消息-

console.log（'got here'）；

它应该是

$（“.openDialog”）。单击（函数（e）{..

<label for="Name">Name:</label><br />

<input id="Namecontact" name="Name" type="text" /><br />

<label for="email">Email:</label><br />

<input id="emailcontact" name="email" type="text" /><br />

<label for="message">Message:</label><br />

<textarea id="messagecontact" name="message"></textarea>

<input class="close" name="submit" type="submit" value="Submit" />