每次使用 ajax 渲染局部视图时运行 jquery 代码

Question

我正在使用 Ajax.Actionlink 在 MVC 中呈现局部视图。我也在使用 Modernizr datepicker，所以 firefox 可以和输入 type=date 的 Chrome 一样好。

当我单击我的第一个 Ajax 操作链接时，日期选择器工作正常。但是当我再次点击它时，它根本不起作用。

如果我重新加载页面 (F5)，它会再次工作，第一次，而不是第二次和以后。

如何解决这个问题，让 jQuery 代码每次都运行，即使我切换到另一个局部视图？

我的 JS：

<script>
    $.noConflict();  
    if (!Modernizr.inputtypes.date) {
        $('input[type=date]').datepicker({ dateFormat: 'yy-mm-dd' });
    }
</script>

编辑：我尝试将 JS 包装在 $(function () {...});并且代码在局部视图内。也尝试使用 OnSuccess 选项，但结果是一样的。它只运行第一次，之后我需要重新加载页面

编辑 2：

我的 Ajax 操作链接：

<div id="createCalcMenu">
@Ajax.ActionLink("Annuity", "Annuity", "Calculation", new AjaxOptions
        {
             UpdateTargetId = "calcDiv",
             InsertionMode = InsertionMode.Replace,
             HttpMethod = "POST"
        })
                    <br />              
@Ajax.ActionLink("Amortization", "Amortization", "Calculation", new AjaxOptions
        {
             UpdateTargetId = "calcDiv",
             InsertionMode = InsertionMode.Replace,
             HttpMethod = "POST"
        })
</div>
    <div id="calcDiv"></div>

编辑 3：

我的部分观点：

@using (Ajax.BeginForm("ShowDetailAnnuity", "Calculation", new AjaxOptions
{
    InsertionMode = InsertionMode.Replace,
    UpdateTargetId = "CalcDetail",
    LoadingElementId = "Loader"
}))
{
<input type="date" id="StartDate" name="startdate" title="Please enter start date (YYYY-mm-dd)" class="startDateTextbox" required />

//Rest of the form here...

<input type="submit" id="calcBtn" class="calcBtn" name="SubmitValue" value="Calculate" title="Calculate your calculation" />
}


<script>
$(function () {
    $.noConflict();
    if (!Modernizr.inputtypes.date) {
        $('input[type=date]').datepicker({ dateFormat: 'yy-mm-dd' });
    }
});
</script>

Answer 1

我认为问题可能出在 jQuery 上

我复制了您的代码，只是在局部视图的脚本中做了一些小改动。 当我第一次运行代码时，它给了我一个错误，说 $ 未定义（尽管我已将 jQuery 库包含到主布局中）。 我在部分布局中手动调用了 jQuery，它起作用了。希望对你有帮助。

以下是我在年金部分视图代码中所做的更改：

<script>
    jQuery(function ($) {
          $.noConflict();
          if (!Modernizr.inputtypes.date) {
              $('input[type=date]').datepicker({ dateFormat: 'yy-mm-dd' });
          }
    });
</script>

无论我点击链接多少次，日期选择器总是为我而来。还要确保你对 JS 文件 jquery 和 mordernizr 的引用只有一次（在主布局中）