我正在使用这个非常方便的 JavaScript 模板库:https ://github.com/blueimp/JavaScript-Templates 。我可以像使用 underscore.js 和 mustache.js 一样创建元素并向它们添加数据。
当我想添加自己的函数而不仅仅是将字符串添加到将填充模板的各个节点的对象时,我的问题就出现了。我想做的是运行函数nicetime()
来更新我新插入的时间,<div>'s
而不是只显示一次时间。
这是代码和完整的演示。
HTML:
<button data-id="1">1</button>
<div data-id="1"></div>
<div id="time_since"></div>
JS:
$(document.body).on('click', 'button', function(){
var id= $(this).data('id');
var data={id:id, string: "just now...", fxn: nicetime()};
var result = tmpl('<div id="string" data-id="'+id+'">{%=o.string%}</div>
<div id="function" data-id="'+id+'">{%=o.fxn%}</div>', data);
$('div[data-id="'+id+'"]').html(result);
nicetime();
});
function nicetime(){
var time = new Date();
var comment_date = setInterval(function() {
var time2 = time_since(time.getTime()/1000);
$('#time_since').html(time2);
return time2;
},
1000);
}
注意:里面nicetime()
有一个jsfiddletime_since()
上可用的功能。它用于像这样格式化日期:“1 秒前……”。