0

我的主要观点：

@Ajax.ActionLink("append smth", "AddSmth", new AjaxOptions { UpdateTargetId = "smthContainer", InsertionMode.InsertAfter })

<div id="smthContainer"></div>

我的控制器：

public ActionResult AddSmth()
{
    return PartialView("Smth");
}

部分观点：

<input type="text" id="dateOfSmth" />

<script type="text/javascript">
$(document).ready(function () {
    $('#dateOfSmth').datepicker();
});
</script>

问题是在将部分视图添加到文档之前调用了就绪函数，因此 $('#dateOfSmth') 为空。如果我用 InsertionMode.Replace 替换 InsertionMode.InsertAfter，一切正常。您知道为什么 InsertionMode.InsertAfter 不能正常工作吗？

编辑：使用 jQuery 附加视图时效果很好：

<a href="javascript:addSmth();"> Add Smth </a>

<script type="text/javascript">
                function addSmth() {
                    $.get('@Html.Raw(Url.Action("AddSmth"))', null, function (view) {
                        $('#smthContainer').append(view);
                    });
                }
</script>
4

2 回答 2

1

下面的代码来自 jQuery 代码库：

 // Make sure body exists, at least, in case IE gets a little overzealous (ticket #5443).
    if (!document.body) {
        return setTimeout(jQuery.ready, 1);
    }

所以 ready 事件一直等到 body 元素被创建。如果在创建 body 元素之后添加局部视图，那么这就是您的函数执行过早的原因。

理论上，您可以在加载局部视图后执行类似的操作来执行代码。

function createDatePicker( ) {

    if ( !document.getElementById("dateOfSmth") ) {

        return setTimeout( createDatePicker, 1);
    }

    // do stuff
}
于 2012-11-12T11:14:36.803 回答
1

该ready事件被触发一次 - 当 DOM 完成加载时 - 当您插入 AJAX 加载的内容时不会再次触发。如果您在ready此之后添加事件处理程序，那么它将自动执行。

InsertionMode.InsertAfter该问题可能是由于两种插入模式以及InsertionMode.Replace处理<script>内容中标签的方式不同造成的。

如果可以，只需致电您的：

$('#dateOfSmth').datepicker();

加载 AJAX 内容后的行。

于 2012-11-12T11:35:27.143 回答