MVC 在局部视图中使用 JS答案

【问题标题】：MVC using JS inside partial viewMVC 在局部视图中使用 JS
【发布时间】：2016-09-28 17:28:51
【问题描述】：

在我的主视图中，我有 ajax 操作链接

例如

  @Ajax.ActionLink("Update Hours", "companyhours", "business",
 new { Id = ViewBag.Id }, new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "divCurrentView" })

控制器内部

 public ActionResult CompanyHours(string Id)
    { ...   return PartialView("UpdateCompanyHours", model);}

点击加载视图

我拥有的部分视图“UpdateCompanyHours.cshtml”

@model CompanyHoursVM
@{Layout = null; }
@using (Ajax.BeginForm("CompanyHours", new AjaxOptions { UpdateTargetId = "presult", HttpMethod = "POST", InsertionMode = InsertionMode.Replace }))
{     
  @Html.ValidationSummary(true)
  @Html.AntiForgeryToken()

  // i have textboxes and a button - everything loads fine
  @Html.CheckBoxFor(model => model.Open247, new { @class = "Time24hrs"})
 }

问题来了：

我想在我的主视图中添加我的 js 文件。将代码添加到主视图页面底部：

@section Scripts
{
    <script src="~/Scripts/myjs.js"></script>
}

甚至没有@section Scripts 标签

js 文件很简单。第一个警报已执行，但 onclick 没有执行

(function () {
$(function () {
    alert("alert1");
    $('.Time24hrs').click(function () {
        alert("alert2");
    });
});
})();

js 无法识别。但是，如果我在局部视图中添加 js 文件，它就可以正常工作

如何让js文件加载到主视图中，并在部分视图中使用js文件？

【问题讨论】：

标签： javascript jquery ajax asp.net-mvc partial-views

【解决方案1】：

当您单击“更新时间”链接时，ajax 代码会动态地将新的 DOM 元素注入当前 dom（部分视图中的标记）。但是您的点击事件是使用现有元素（页面加载时的当前元素）注册的。没有为这些新的 dom 元素注册点击事件处理程序。

使用jQueryon方法绑定点击事件。使用on 方法，您可以为DOM 的当前和未来元素 注册事件

这应该可行。

$(function () {

    $(document).on("click",".Time24hrs",function () {
        alert("alert2");
    });

});

【讨论】：

【解决方案2】：

我敢打赌，在调用主页面的加载函数后，ajax 调用会异步返回您的部分完成，在这种情况下，没有机会按照您的方式设置事件处理程序，因为该元素尚未添加到大教堂。当你的部分被加载时，你需要以某种方式通知。

【讨论】：