Click binding not working
I'm having trouble with the click
binding. I'm trying to run some sample code from the Knockout website, which isn't working. The number of clicks isn't updating. I'm not getting any javascript errors in Firefox. Can someone help?
This is the code I have:
<head runat="server">
<script type="text/javascript" src="/Scripts/jquery-1.6.4.js"></script>
<script type="text/javascript" src="/Scripts/jquery.tmpl.js"></script>
<script type="text/javascript" src="/Scripts/knockout-1.2.1.js"></script>
<script type="text/javascript">
var clickCounterViewModel = function () {
this.numberOfClicks = ko.observable(0);
this.registerClick = function () {
this.numberOfClicks(this.numberOfClicks() + 1);
}
this.hasClickedTooManyTimes = ko.dependentObservable(function () {
return this.numberOfClicks() >= 3;
}, this);
};
ko.applyBindings(new clickCounterViewModel());
</script>
</head>
<body>
<div>Yo开发者_C百科u've clicked <span data-bind="text: numberOfClicks"> </span> times</div>
<button data-bind="click: registerClick, enable: !hasClickedTooManyTimes()">Click me</button>
<div data-bind="visible: hasClickedTooManyTimes">
That's too many clicks! Please stop before you wear out your fingers.
<button data-bind="click: function() { numberOfClicks(0) }">Reset clicks</button>
</div>
</body>
You want to move your script tag to the bottom of the document or put it in a an onload/ready function. You need at least ko.applyBindings
to execute after the rest of the DOM has been loaded.
精彩评论