我正在尝试使用 knockout.js 从 json 中提取一个数字,然后使用 jquery 来调整我的进度条。
它在手动将数字输入到 html 时起作用。使用 json 输入号码时不起作用。
我不确定这是否与敲除/json 和 jquery 冲突,或者我的代码是否错误?
http://jsfiddle.net/infatti/5Q9pK/
// Knockout.js - bring in number of days from json
// -------------------------
// Here's my data model
var viewModel;
$.getJSON('http://echo.jsontest.com/daysDue/50', function (data) {
viewModel = ko.mapping.fromJS(data);
ko.applyBindings(viewModel);
});
// Progress Bar - adjust width of progress bar according to number of days
// -------------------------
$('#paging1 ul li').each(function () {
// progress bar
// find number of days until due date
var progBarValue = $(this).find('.days-due').text();
// limit days due to no more than 100%
progBarValue = progBarValue > 100 ? 98 : progBarValue;
// set progress bar width
$(this).find('.bar').width((100 - progBarValue) +'%');
// set class of progress bar for color based on days due
if (progBarValue >= 75) {
$(this).find('.progress').removeClass('progress-warning progress-danger').addClass('progress-success');
$(this).find('.DueDate').removeClass('urgent');
} else if (progBarValue >= 25 && progBarValue <= 74) {
$(this).find('.progress').removeClass('progress-success progress-danger').addClass('progress-warning');
$(this).find('.DueDate').removeClass('urgent');
} else if (progBarValue <= 24) {
$(this).find('.progress').removeClass('progress-warning progress-success').addClass('progress-danger');
$(this).find('.DueDate').addClass('urgent');
}
});