1

我有一个主页，其中包含所有引用的脚本，在正文中我有一个具有模板数据绑定的 duv 容器，并且我的 htm 正在那里绑定。

问题是我由 Jquery 控制的功能无法正常工作。例如，当我将日期选择器放在引用 JavaScript 的主页中时，它可以工作，但在绑定到模板的 htm 中不起作用。

所有库都已正确加载，但我的 jquery 功能在模板内被调用时不起作用。

例如主页：

<script src="Scripts/jquery.js" type="text/javascript"></script>
<script src="Scripts/jquery.qtip.js"></script>
<script src="Scripts/foundation.min.js"></script>
<script src="Scripts/jquery.tablesorter.js"></script>
<script src="Scripts/jquery-ui.js"></script>
<script src="Scripts/languageswitcher.js"></script>

<div id="Container" ua-app-id="topVm" data-bind='template: {name: pageModel, data: pageVM }'>                   
</div>
<!-- Initialize JS Plugins -->
<script src="Scripts/app.js"></script>

现在我的视图在运行时加载到主页中。在我看来，我有一个日期选择器，它不起作用。当我把它放在主页上时，它工作正常。

4

1 回答 1

0

我认为这是因为您的 jQuery 代码是在渲染模板之前运行的。您可以使用模板绑定中提供的 afterRender 回调来启用日期选择器。查看文档以获取更多信息和示例。

但实现这一点的更好方法是创建自定义绑定。像这样的东西：

ko.bindingHandlers.datepicker = {
    init: function(element){
        $(element).datepicker();
    },
    update: function(element) {
        $(element).datepicker('refresh');
    }
};

然后，您可以通过执行以下操作将文本输入到日期选择器中：

<input type="text" data-bind="datepicker:true" />

在此处阅读有关自定义绑定的更多信息

于 2013-01-22T22:35:09.427 回答