2013-08-16 25 views
1

有一個由jquery插件生成的日期列表。我可以用moment.js做到這一點,它的工作原理如下:使用以獲取生成的日期並重用它jquery

看到這個小提琴(http://jsfiddle.net/UJ9z4/)。

當我嘗試將它應用於運行插件的活動文件時,出現未定義的錯誤。

我明白這意味着,我不能搶日期,因爲它是在DOM中新創建的。所以,我試圖在加載後使用「on」來獲取跨度的內容,但不起作用。我嘗試過不同的方式來看待不同的線程,而且沒有一個可以工作。

這是代碼

<!--template for calendar list -->  
    <div id="cactuscal"> 
    <div class="gcf-item-container-block"> 
    <div class="gcf-item-block"> 
    <div class="gcf-item-header-block"> 
     <div class="gcf-item-date-block"> 
     <span class="gcf-item-daterange"></span> 
     </div> 
     <div class="gcf-item-title-block"> 
     <strong class="gcf-item-title"></strong> 
     </div> 
    </div> 
    <div class="gcf-item-body-block"> 
     <div class="gcf-item-description"> 
     </div> 
     <div class="gcf-item-location"> 
     </div> 
    </div> 
    </div> 
</div> 
</div><!--template for calendar list -->   
    <script type="text/javascript"> 

     $('#cactuscal').gCalFlow({ 
     calid: '[email protected]', 
     link_item_title: false, 
     maxitem: 6, 
    daterange_formatter: function(sd, ed, allday_p) { return "<span class='startdate' data-date='" + (sd.getFullYear()) + "-" + (sd.getMonth() + 1) + "-" + (sd.getDate()) +"'>" + "</span>" + " – " + "<span id='enddate'"+">" + (ed.getFullYear()) + "-" + (ed.getMonth() + 1) + "-" + (ed.getDate()) + "</span>" } 
     }); 

    </script> 
<script type="text/javascript"> 
$(document).on("ready",function(){ 
    $('.startdate').each(function() { 
    var then = $(this); 

date = moment(then.attr('data-date')), 
update = function(){ 
    then.html(date.format("dddd[(]M[/]D[)]")); 
    then.trigger('onCreated'); 
}; 

update(); 
setInterval(update, 60000); 
}); 
    }); 
</script> 

沒有在gcalflow沒有選項格式化日期範圍,我想這樣的方式,我想用瞬間抓住繩子,重新格式化的方式。

我需要在gcalpro腳本中創建一個新選項來格式化我想要的方式嗎?或將這項工作? html部分是Google日曆Feed的模板。第一個js是調用gcalflow來顯示日曆提要。最後的js將重新格式化日期。

回答

0

gCalFlow調用異步工作,所以在創建gCalFlow的DOM元素之前調用用於更新元素的代碼。 (您無法準確知道gCalFlow何時創建元素)

您應該做的是將您的代碼作爲回調函數添加到cCalFlow調用中。這種方式在 cCalFlow完成後被稱爲

$('#cactuscal').gCalFlow({ 
    calid: '[email protected]', 
    link_item_title: false, 
    maxitem: 6, 
    daterange_formatter: function(sd, ed, allday_p) { 
     return "<span class='startdate' data-date='" + (sd.getFullYear()) + "-" + (sd.getMonth() + 1) + "-" + (sd.getDate()) + "'>" + "</span>" + " – " + "<span id='enddate'" + ">" + (ed.getFullYear()) + "-" + (ed.getMonth() + 1) + "-" + (ed.getDate()) + "</span>" 
    }, 
    callback: afterGCalFlowIsFinished 
}); 

function afterGCalFlowIsFinished(){ 
    $('.startdate').each(function() { 
     ... 
    } 
} 
相關問題