爲什麼風格對動態添加的內容沒有任何影響

我正在一個SharePoint頁面上工作。這裏我添加了一個嵌入代碼，這將動態構建使用jQuery的表： -爲什麼風格對動態添加的內容沒有任何影響

<script> 
function getCurrentMainCategoryID(){ 

var results = ""; 
var html=""; 
html="<table class='table' style='border-collapse:separate;border-spacing:1em;'><th style='text-align:left'></th><th style='text-align:right'></th><th style='text-align:right'>Pages</th>"; 
    var url = "/_api/web/lists/getbytitle('MainCategory')/items?$select=Title"; 

    $.ajax({ 
    url: url, 
    method: "GET", 
    async: false, 
    headers: { "Accept": "application/json; odata=verbose" }, 
    success: function (data) { 
     if(data.d.results.length>0){ 


      results = data.d.results; 
      for(var j2=0;j2<results.length;j2++) 
      { 


      var currentMainCatTitle = results[j2].Title; 

    $.ajax({ 
    url: "/_api/web/lists/getbytitle('pages')/items??$select=Title,MainCategory&$filter=MainCategory eq " + "'" + currentMainCatTitle +"'" , 
    method: "GET", 
    async: false, 
    headers: { "Accept": "application/json; odata=verbose" }, 
    success: function (data) { 
     if(data.d.results.length>0){ 
      html=html+"<tr><td>" 
      + "<a href='/kb/BusinessContinuityPlan/Pages/Forms/AllItems.aspx?TreeField=MainCategory&TreeValue=" 
      + currentMainCatTitle + 
      "#ServerFilter=FilterField1=MainCategory-FilterValue1=" 
      + currentMainCatTitle + 
      "-TreeField=MainCategory-TreeValue=" 
      + currentMainCatTitle + 
      "-OverrideScope=RecursiveAll-ProcessQStringToCAML=1'>"+ currentMainCatTitle+"</a></td>" 
      + "<td> </td><td style='text-align:right'>"+data.d.results.length+"</td></tr>"; 

     } 

    }, 
    error: function (data) { 

    } 
    }); 
      } 


     } 

    }, 
    error: function (data) { 


    } 
    }); 
    $("#inserthere").after(html+"</table>"); 

    return results; 
    </script>

現在我會得到相關的正確能力。但我想在桌面上添加一些懸停效果。所以我說下面的樣式腳本如下以上： -

<style> 
.table tbody tr:hover td, .table tbody tr:hover th { 
background-color:#eeeeea; 
} 
</style>

但問題是，風格沒有任何效果..所以任何人都可以建議對這個？作爲一般規則，任何動態添加的內容都會獲得當前的css設置？

編輯 OK我加入了class="table"，現在我可以看到懸停效果，如下圖： -

，但現在知道爲什麼我得到了<td>之間的白色？

來源

2017-03-02 john G

您忘了在使用JavaScript添加到DOM中的html中添加'tbody'。 – itzmukeshy7

你必須至少存在如下問題：

你的表沒有使用.table類。您需要將以下屬性class="table"添加到您正在創建的此元素<table style='boarder:3px solid;border-collapse:separate;border-spacing:1em;'>。或者，您可以更改樣式以使用table而不是.table。

另一個小問題是boarder:3px solid在你的表格樣式中拼寫不正確，但這不是你所問的問題。

來源

2017-03-02 13:38:48

你是正確的，但現在我無法渲染一個有爭議的懸停,,你可以檢查我的編輯pelase？ –

更改類=「表」，類=「表」，後html =「<表....」 –

@VasHanea是我錯了在這裏鍵入..但這並沒有nto修復懸停裏面的空白.. –

爲什麼風格對動態添加的內容沒有任何影響

回答

相關問題