JQUERY Css直到刷新頁面之後才被應用

我在RAZOR MVC應用程序的單獨js文件中使用JQuery來使用APPEND方法從頭開始動態構建html表。這工作正常，但是當我使用ADDCLASS時，似乎沒有任何的CSS應用，直到我刷新頁面。有時根本不會！該代碼是一個簡單的表格，其中包含30天的標題單元格，下面的另一行包含一個單元格。我還包括我的CSS。JQUERY Css直到刷新頁面之後才被應用

$(document).ready(function() { 
    var startDate = $.telerik.formatString('{0:d}', $("#Start").data("tDatePicker").value()); 
    var forCalendarStartDate = new Date(startDate); 

    $('#CalendarWrapper').append('<table id="Master"></table>'); 
    $('#Master').append('<tr id="MasterDatesRow"></tr>'); 
    for (var i = 0; i < 31; i++) { 
     var headerDate = new Date(); 
     var d = new Date(headerDate.setDate(forCalendarStartDate.getDate() + i)); 
     var s = $.datepicker.formatDate('mm-dd', d); 

     $('#MasterDatesRow').append('<th>' + s + '</th>'); 
    } 
    $('#Master').append('<tr id="Header1"></tr>'); 
    $('#HeaderUSARAF').append('<td colspan="31" id="HeaderCell">USARAF</td>'); 

    //Class 
    $('#Master').addClass('CalendarTable'); 
    $('#MasterDatesRow').addClass('DateHeader'); 
    $('#HeaderCell').addClass('Header'); 
});

CSS

.CalendarTable 
{ 
    border:1; 
    width:100%; 
    font-size:small; 
} 

.DateHeader 
{ 
    background-color:Green; 

} 

.Header 
{ 
    background-color:#DBACBC; 
    text-align:center; 
}

來源

2012-05-22 Ryan Lege

你的問題與ASP.NET MVC3有什麼關係？你能解決你的標籤嗎？ –

不確定。這就是爲什麼我問。我不確定在頁面加載後是否應用CSS以及何時應用CSS –

只需確保您的html CalendarWrapper元素在$（document）.ready（function（）'被調用 – Ashwin

既然你直接生成表的HTML，我建議你把class="className"值直接插入HTML字符串，而不是設置元素類代碼：http://jsfiddle.net/tNVGJ/

如果你堅持用jQuery設置類，你可以試試這個，讓我知道它是如何產生的？ http://jsfiddle.net/tNVGJ/1/

setTimeout(function() { 
      $('#Master').addClass('CalendarTable'); 
      $('#MasterDatesRow').addClass('DateHeader'); 
      $('#HeaderCell').addClass('Header'); 
}, 1000);

來源

2012-05-22 13:33:34

JQUERY Css直到刷新頁面之後才被應用

回答

相關問題