[英]KnockoutJS "click: binding not working
我正在嘗試創建一個頁面,當單擊另一個按鈕時,該頁面將替換DOM元素中的內容。 我正在使用KnockoutJS來管理綁定和點擊事件。 我的ViewModel中有一個方法,它將從文本文件中加載一些文本,並用文本文件內容替換DOM內容。 問題是點擊似乎不起作用:
HTML
<!DOCTYPE html>
<html>
<head>
<title>About Me</title>
<link rel="stylesheet" type="text/css" href="css/styles.css">
<script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="js/knockout-3.3.0.js"></script>
<script src="js/nav-mobile.js"></script>
<script src="js/app.js"></script>
</head>
<body>
<!-- nav bar -->
<nav>
<ul class="navbar">
<li><h1 class="title">About Me</h1></li>
<li class="nav-text" data-bind="click: setPage.bind('fam')"><p>Family</p></li>
<li class="nav-text" data-bind="click: setPage.bind('mlg')"><p>MLG</p></li>
<li class="nav-text" data-bind="click: setPage.bind('bio')"><p>Bio</p></li>
<li class="nav-text" data-bind="click: setPage.bind('int')"><p>Interests</p></li>
</ul>
</nav>
<!-- main section -->
<section>
<div class="main">
<p class="text-main"></p>
</div>
</section>
</body>
</html>
JavaScript的
$(document).ready(function() {
function ViewModel() {
var self = this;
self.text = ko.observable();
self.setPage = function(page) {
$.get("../res/text/" + page + ".txt", function(data) {
console.log("Fetching " + page + ".text" );
$(".text-main").html(data);
});
}
}
ko.applyBindings(new ViewModel());
});
我至少希望記錄到控制台的東西,但沒有。 開發人員工具不顯示任何內容。 我也試過像這樣的綁定:
data-bind="click: setPage('fam')"
但它不起作用。 我的點擊綁定有什么問題?
使用.bind
的正確語法是.bind($data, 'parameter')
<li class="nav-text" data-bind="click: setPage.bind($data, 'fam')"><p>Family</p></li>
<li class="nav-text" data-bind="click: setPage.bind($data, 'mlg')"><p>MLG</p></li>
<li class="nav-text" data-bind="click: setPage.bind($data, 'bio')"><p>Bio</p></li>
<li class="nav-text" data-bind="click: setPage.bind($data, 'int')"><p>Interests</p></li>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.