jQuery/javascript 添加类在 IE 8,9 上不起作用

Question

我有一个这样的 div：

<div onclick="highlightFunction(<?php echo $id?>);">

我有以下js代码：

 function highlightFunction(id) {   
    var id = "stuff" + stuff_id;
    $('#boss-stuff').find('div').removeClass('highlight-stuff');
    var stuff = $('#' + id).find('div')[0];
    var jStuff = $(stuff);
    jStuff.addClass("highlight-stuff");
 }

这段代码被放置在一个 onlick 句柄函数中。

“highlight-stuff”类只是添加了背景颜色。

我尝试了各种方法，从带有 document.getElementById().className 的 javascript 到 jQuery element.attr("class","stuff") 等。所有这些都适用于各种浏览器，但是 IE 8 和 9 不起作用。背景没有改变。

请帮忙，谢谢，我真的很感激。如果您需要代码中的更多内容，请告诉我。

有人解释说：id 是唯一的，因此不会有超过一个具有相同 id 的元素。 $('#boss-stuff') 有一个 $('#id') 列表。 $('#id') 是一个 li 元素，有 div child(ren)。我想为 div 类添加背景颜色。

Answer 1

试试这个

var jStuff = $('#' + id).find('div')[0];
jStuff.addClass("highlight-stuff");

Answer 2

它在其他浏览器而不是IE 中工作的事实听起来像是在DOM Ready 事件中不包含您的代码一样愚蠢。我记得前段时间遇到过类似的问题。

你可以试试（如果你的代码已经不在 DOM 就绪事件中）：

HTML

<div onclick="highlightFunction(<?php echo $id?>);">

Javascript

<script type="text/javascript">
// This is really important.. make sure all jQuery is inside the DOM ready event
$(function(){ 
    function highlightFunction(id) {   
        var id = "stuff" + stuff_id;
        $('#boss-stuff').find('div').removeClass('highlight-stuff');
        var stuff = $('#' + id).find('div')[0];
        var jStuff = $(stuff);
        jStuff.addClass("highlight-stuff");
    }
});
</script>

Answer 3

也许您的 HTML 层次结构太复杂了？我试过这个，addClass 适用于所有浏览器。

HTML

<div id="boss-stuff">
    <div id="stuffst123456">
        <div id=""class="">Div without class</div>
        <div id="" class="highlight-stuff">Div With Class</div>
        </div>
    <div id="st123457">Other Div</div>  
</div>
<input id="testBtn" type="button" value="Click Me" />

JavaScript

   <script type="text/javascript">
    $(document).ready(function () {
        $("#testBtn").click(function () {
            var id = "stuff" + "st123456";
            $('#boss-stuff').find('div').removeClass('highlight-stuff');
            var stuff = $('#' + id).find('div')[0];
            var jStuff = $(stuff);
            jStuff.addClass("highlight-stuff");
        });
    });
</script>

CSS

.highlight-stuff {
color: #ff0000;

}