Question

在我的主视图中，我有一个ajax动作链接

e.g。

  @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);}

点击

加载视图

部分视图＆＃34; UpdateCompanyHours.cshtml＆＃34;我有

@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文件非常简单。第一个警报被执行但是点击它不会

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

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

如何在主视图中加载js文件并在局部视图中使用js文件？

Answer 1

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

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

这应该有用。

$(function () {

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

});

Answer 2

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

MVC在局部视图中使用JS

2 个答案: