在ajax加载的部分视图（引导模式表单）中为元素触发jquery事件

我正试图找出初始化jquery事件的正确方法，该事件引用通过ajax加载的部分视图元素。具体地说，我试图以引导模式的形式在中使用bootstrap-datepicker.js

背景：有一个功能正常的页面，日期选择器正在工作。今天的项目是将该表单转换为引导模式。我所做的很多事情都来自于

一切正常。由于我现在通过ajax加载部分视图，datepicker无法工作。我理解这个问题，只是不知道解决办法。谢谢你的建议

调用视图已

<div class="modal hide fade in" id="addclassroom">
    <div id="classroom-container"></div>
<div>

<script type="text/javascript">
$(document).ready(function () {
    $('#addclassbtn').click(function () {
        var url = "/Quiz/AddClassroom?quizId=@ViewBag.quizid"; 
        $.get(url, function (data) {
            $('#classroom-container').html(data);
            $('#addclassroom').modal('show');
        });
    });
});
</script>

public ActionResult AddClassroom(int quizId)
{
    var classroom = ...
    return PartialView("_AddClassroom",classroom);
}

@using (Ajax.BeginForm("AddClassroom", "Quiz", FormMethod.Post,
                    new AjaxOptions
                    {
                        //InsertionMode = InsertionMode.Replace,
                        HttpMethod = "POST",
                        UpdateTargetId = "addclassroom"
                    }))
    {
        @Html.ValidationSummary()
        @Html.AntiForgeryToken()
        <div class="modal-body">
            <fieldset class="QuizDisplayFields">
                *fields...etc*
                @Html.TextBoxFor(model => model.StartDate, new {@class="datefield" })
                @Html.ValidationMessageFor(model => model.StartDate)
                *more fields...*
                <input type="submit" class = "btn btn-primary" value="Save" />
            </fieldset>
        </div>
    }

<link href="~/Content/datepicker.css" rel="stylesheet" />
<script src="~/Scripts/bootstrap-datepicker.js"></script>

   <script>
    $(document).ready(function () {
        $("#StartDate").datepicker();
    });
   </script>
   <script>
       $(function ($) {
           $("#StartDate").on("click").datepicker();
       });
   </script>

局部视图：

<div class="modal hide fade in" id="addclassroom">
    <div id="classroom-container"></div>
<div>

<script type="text/javascript">
$(document).ready(function () {
    $('#addclassbtn').click(function () {
        var url = "/Quiz/AddClassroom?quizId=@ViewBag.quizid"; 
        $.get(url, function (data) {
            $('#classroom-container').html(data);
            $('#addclassroom').modal('show');
        });
    });
});
</script>

public ActionResult AddClassroom(int quizId)
{
    var classroom = ...
    return PartialView("_AddClassroom",classroom);
}

@using (Ajax.BeginForm("AddClassroom", "Quiz", FormMethod.Post,
                    new AjaxOptions
                    {
                        //InsertionMode = InsertionMode.Replace,
                        HttpMethod = "POST",
                        UpdateTargetId = "addclassroom"
                    }))
    {
        @Html.ValidationSummary()
        @Html.AntiForgeryToken()
        <div class="modal-body">
            <fieldset class="QuizDisplayFields">
                *fields...etc*
                @Html.TextBoxFor(model => model.StartDate, new {@class="datefield" })
                @Html.ValidationMessageFor(model => model.StartDate)
                *more fields...*
                <input type="submit" class = "btn btn-primary" value="Save" />
            </fieldset>
        </div>
    }

<link href="~/Content/datepicker.css" rel="stylesheet" />
<script src="~/Scripts/bootstrap-datepicker.js"></script>

   <script>
    $(document).ready(function () {
        $("#StartDate").datepicker();
    });
   </script>
   <script>
       $(function ($) {
           $("#StartDate").on("click").datepicker();
       });
   </script>

@使用（Ajax.BeginForm（“add教室”、“测验”、FormMethod.Post、，
新选择
{
//InsertionMode=InsertionMode.Replace，
HttpMethod=“POST”，
UpdateTargetId=“AddClassification”
}))
{
@Html.ValidationSummary（）
@Html.AntiForgeryToken（）
*田野……等*
@Html.TextBoxFor（model=>model.StartDate，new{@class=“datefield”}）
@Html.ValidationMessageFor（model=>model.StartDate）
*更多领域*
}
$（文档）.ready（函数（）{
$（“#StartDate”）.datepicker（）；
});
$（函数（$）{
$（“#开始日期”）。在（“单击”）.datepicker（）上；
});

$（文档）。ready

在局部应用中不起作用。它仅在最初加载页面时执行

---

因此，您需要将这些脚本（在partial中）转换为ajax调用的回调函数

谢谢你的回复。这是我收集到的，但我试过的都不管用。答案是这个和那个的结合：出于我不太明白的原因，我不得不将.datepicker{z-index:1151；}添加到我的css中。z索引修复看起来像是日期选择器隐藏在模型后面。引导模式的z索引为1050，因此datepicker被赋予更高的z索引值。