1

有人能帮我弄清楚为什么我的 javascript HTML 模板不会自动更新时间,但常规 HTML 会吗?这是我正在使用的模板库:https ://github.com/blueimp/JavaScript-Templates

这是我的 JS(你可以在这里摆弄它:http: //jsfiddle.net/trpeters1/SpYXM/76/):

$(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);
}

HTML:

<button data-id="1">1</button>
<div data-id="1"></div>  //tmpl output
<div id="time_since"></div>  //non-tmpl output
4

1 回答 1

3

你想要这样的东西

使用 JavaScript 模板,您通常希望模板一次,然后动态更新特定元素的值,而不是每秒重置整个元素的 innerHTML。

这是JavaScript:

$(document.body).on('click', 'button', function(){
    var id= $(this).val(),
        time = +new Date,
        data = {
            id: id,
            string: "just now..."
        },    
        result = tmpl('<span class="string">{%=o.string%}</span>', data),
        tgt = $('#'+id),
        str;
    tgt.html(result);    
    str = tgt.find('.string');
    window.setInterval(function() {
        str.html(time_since(time/1000));
    }, 1000);
});
于 2012-05-06T18:46:34.637 回答