Javascript 使用knockoutJS中的函数向div添加CSS
我正在尝试在knockoutJS中实现CSS绑定 我想一个接一个地打印名称数组中的所有名称。 问题是还有另一个数组有一些特殊的名称 所有的特殊名称都应该得到“Javascript 使用knockoutJS中的函数向div添加CSS,javascript,jquery,html,css,knockout.js,Javascript,Jquery,Html,Css,Knockout.js,我正在尝试在knockoutJS中实现CSS绑定 我想一个接一个地打印名称数组中的所有名称。 问题是还有另一个数组有一些特殊的名称 所有的特殊名称都应该得到“good”CSS类。其余的是“坏的”“css类 以下是我尝试过的一些东西： HTML 小提琴- 现在它不工作了。在控制台中，它给了我“脚本错误（第0行）” 谢谢 开箱即用的CSS绑定有点棘手。指定类名，然后指定应用该类名的条件 令人惊叹的！谢谢你让我今晚很开心！ <!DOCTYPE html> <html> &l
good谢谢 开箱即用的CSS绑定有点棘手。指定类名，然后指定应用该类名的条件
令人惊叹的！谢谢你让我今晚很开心！
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
<link href="http://getbootstrap.com/dist/css/bootstrap.css" rel="stylesheet" type="text/css" />
<script src="http://getbootstrap.com/dist/js/bootstrap.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/knockout/3.0.0/knockout-min.js"></script>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<div data-bind="foreach : items">
<div data-bind="text: $data, css: checkName($data)" ></div>
</div>
</body>
</html>
var dataModel = function(){
self.items = ko.observableArray(["don","bom","harry","sharry","ron"]);
self.names = ["ron","harry"];
self.checkName = ko.observable(function(name){
if( $.inArray(name,self.names) ){
return "good";
}
else{
return "bad";
}
});
};
ko.applyBindings(new dataModel());
<div data-bind="foreach : items">
<div data-bind="text: $data, css: { good: isGoodName($data), bad: !isGoodName($data) }" ></div>
</div>
var dataModel = function(){
self.items = ko.observableArray(["don","bom","harry","sharry","ron"]);
self.names = ["ron","harry"];
self.isGoodName = function (name) {
return $.inArray(name, self.names) !== -1;
};
};
ko.applyBindings(new dataModel());