我正在使用 Knockout.js 构建客户端 View 模型。在我的 View 模型中,我想公开一些可以绑定(bind)到页面元素的函数(典型的 MVVM 模型)。我只希望调用这些函数来响应来自按钮的单击事件,但是它们是在构建 View 模型时调用的...
我这样定义我的模型:
<script type="text/javascript">
var ViewModel = function(initialData) {
var self = this;
self.id = initialData;
self.isSubscribed = ko.observable(false);
self.name = ko.observable();
self.SubscribeToCategory = function () {
$.ajax({
url: '@Url.Action("Subscribe", "Category")',
type: 'POST',
data: {
categoryId: self.id
},
success: function () {
self.isSubscribed(true);
},
failure: function () {
self.isSubscribed(false);
}
});
alert('Subscribing...');
};
self.UnsubscribeFromCategory = function () {
$.ajax({
url: '@Url.Action("Unsubscribe", "Category")',
type: 'POST',
data: {
categoryId: self.id
},
success: function () {
self.isSubscribed(false);
},
failure: function () {
self.isSubscribed(true);
}
});
alert('Unsubscribing...');
};
self.LoadCategory = function () {
$.ajax({
url: '@Url.Action("GetCategory", "Category")',
type: 'POST',
async: true,
data: {
categoryId: self.id
},
dataType: 'json',
success: function (data) {
self.isSubscribed(data.IsSubscribed);
self.name(data.Name);
}
});
};
self.LoadCategory();
};
$(document).ready(function () {
var data = '@Model';
var viewModel = new ViewModel(data);
ko.applyBindings(viewModel);
});
然而,当我执行代码时,这两个警报会自动触发,但我并不期望它们会触发。我正在使用 ASP MVC4,使用 View 模型的 HTML 如下:
<p>
ID: <span data-bind="text: id"></span>
</p>
<div id="subscribe" data-bind="visible: isSubscribed == false">
<button data-bind="click: SubscribeToCategory()">Subscribe</button>
</div>
<div id="unsubscribe" data-bind="visible: isSubscribed == true">
<button data-bind="click: UnsubscribeFromCategory()">Unsubscribe</button>
</div>
<div>
Category Name: <span data-bind="text: name"></span>
Is Subscribed: <span data-bind="text: isSubscribed"></span>
</div>
我查看了在线教程和其他一些 knockout 示例,以及我使用 knockout 的代码中的其他地方,但我不明白为什么这两个函数(SubscribeToCategory 和 UnsubscribeFromCategory)在文档加载时触发。
最佳答案
我花了一秒钟,但最终是一个简单的修复。从你的 data-bind="click: SubscribeToCategory()"中删除 () 并让你点击处理程序这个 data-bind="click: SubscribeToCategory"和 data-bind="click: UnsubscribeFromCategory"
关于javascript - Knockout JS 在加载时调用函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10332723/