jquery addclass正在添加一個類，但沒有顯示

我使用perl，mysql和JS/Jquery動態創建html ...頁面的基本結構是在perl循環中創建的，以便打印多個重複行 - 其中是：jquery addclass正在添加一個類，但沒有顯示

print "<div id='eventList'>"; 
print-loop { 
    <div class="eventRow"> 
     <div class="eventHiddenType">$typeid</div> 
     <div class="colE1">$datestring</div> 
     <div class="colE2">$venue</div> 
     <div class="colE3">$title</div> 
    </div> 
} 
print '</div>'

$ vars在運行時正確從數據庫中提取。

$ typeid的存儲在一個隱藏的div是在JS以後使用（見下文）

的CSS是：

#eventList { width:900px; height: 454px; overflow-x:hidden; overflow-y:scroll; } 
.eventRow { overflow: auto; height: 58px; } 
.eventHiddenType { float:left; display:none; padding: 0px; margin: 0px; } 
.colE1 { float: left; width: 165px; color: #000; } 
.colE2 { float: left; width: 290px; color: #000; } 
.colE3 { float: left; width: 395px; color: #000; } 

.EvDiv0 { background-color: #000000 !important; } // Type 1 
.EvDiv1 { background-color: #C6FFED !important; } // Type 2 
.EvDiv2 { background-color: #B3CCFF !important; } // Type 3 
.EvDiv3 { background-color: #DAB0FF !important; } // Type 4

的HTML是由通過$從jQuery的調用perl的書面阿賈克斯（帶有Async：假）

然後我和條紋行：

$(".eventRow:even").css('background-color', '#f3f3f3');

。W這是應該的。

問題在於我根據存儲在隱藏分度類.eventHiddenType與值試圖然後改變第一單元格的背景色與.addClass（每行中的）：

$('.eventRow').each(function() { 
    var hid = 'EvDiv' + $(this).children('.eventHiddenType').text(); 
    $(this).children('.colE1').addClass(hid); 
});

源被正確地改變爲

<div class="colE1 EvDiv3">blah blah blah</div>

...的每一行...即用正確的「EvDivX」類（如X =隱藏式）

卜加入t背景在瀏覽器中不會呈現出來 - 就像它一直穿過條紋一樣。

我甚至嘗試添加一個「！重要」的類以爲它會迫使它通過，但它沒有...

我知道還有其他幾種方法可以達到我想要的效果，但我可以看不出爲什麼這個一個不起作用。

看到它在行動：http://jsfiddle.net/Upland/2KBPU/1/

任何想法？

來源

2012-03-27 Upland

適合我，你有鏈接嗎？ – WebweaverD 2012-03-27 11:39:12

http://jsfiddle.net/Upland/2KBPU/ – Upland 2012-03-27 12:26:32

@WebweaverD http://jsfiddle.net/Upland/2KBPU/ 注意（通過螢火蟲等）日期div的類有背景類正確添加根據在相應的隱藏div中的值...但它不顯示瀏覽器中的背景顏色。你看到它在哪裏工作？你有鏈接嗎？ – Upland 2012-03-27 12:32:52

問題是你在你的CSS中有無效的註釋標籤，這就是CSS解釋問題。 //無效，但/* ... */是。正如我在上面的評論中指出的那樣，您還正在生成一個類EvDiv4，該類似乎沒有定義。

Updated jsFiddle example。

來源

2012-03-27 14:49:05 j08691

Aaaaaagh！對，就是那樣！！ ...％＆*評論!!!!在CSS中切換/ * --- * /和在...中切換JS和＃...在perl中會發生這種情況。 EvDiv4只是我粘貼演示時削減代碼行數的結果。謝謝！ – Upland 2012-03-27 15:12:39

沒問題，很高興我能幫到你。多年來我犯了幾次錯誤。 – j08691 2012-03-27 15:28:43

jquery addclass正在添加一個類，但沒有顯示

回答

相關問題