In-tag'onload'JS對目標沒有影響

Question

我在我的html.twig模板中找到了此行。

<div class="panel panel-default" onload="(this.class = determineClass(this))">

及更高版本：

var determineClass = function(element) { 
    if (element.offsetHeight < element.scrollHeight) { 
     return element.class + ' some_class'; 
    } else { 
     return element.class + ' some_other_class'; 
    } 
} 

我預計在onload的字符串，如JS執行。但是，該字符串按字面解釋，並且對該標籤的class沒有影響。

我怎樣才能用determineClass函數來改變這個標籤的class屬性？

Answer 1

據我所知，你不能在div上使用onload。使用JQuery，這是一條路（參見fiddle）。

HTML

<div class="panel panel-default determineClass"></div> 

JS

$(document).ready(function() { 
    $('.determineClass').each(function() { 
    $(this).removeClass('determineClass'); 
    if ($(this).offsetHeight < $(this).scrollHeight) { 
     $(this).addClass('some_class'); 
    } else { 
     $(this).addClass('some_other_class'); 
    } 
    }); 
}); 

的ready確保函數的文檔，如果完全加載後運行。我使用類determineClass作爲標誌來標記需要處理的元素。

加載文檔後，我遍歷所有標記的元素，移除標誌類並進行實際處理。