图像 src 替换不起作用答案

【问题标题】：Image src replace not working图像 src 替换不起作用
【发布时间】：2012-12-05 22:36:59
【问题描述】：

我有一个手风琴菜单，活动链接下拉菜单，将外部页面加载到div，然后在同一次单击时更改横幅。除了更改横幅图像外，我一切正常。我以为我的代码是正确的，但似乎缺少某些东西，我无法弄清楚。

这是我的html：

<section id="commercialBanner">
    <img src="images/catalog/indoorBanner.jpg"/>
</section>  

<section id="accordionNav">
    <ul id="nav">
        <li id="indoorEntrance" class="category"><a class="ext" id="indoor" href="montage.html">Indoor Entrance</a>
            <ul id="indoorEntranceSubmenu" class="sideSub">
                <li><a href="montage.html" class="ext">Ecomat Squares</a></li>
                <li><a href="gatekeeper.html" class="ext">Gatekeeper</a></li>
                <li><a href="absorba.html" class="ext">Absorba</a></li>
            </ul>
        </li>
        <li id="outdoorEntrance" class="category"><a id="outdoor" class="ext" href="aquaFlow.html">Outdoor Mats</a>
            <ul id="outdoorEntranceSubmenu" class="sideSub">
                <li><a href="aquaFlow.html" class="ext" id="aquaflow">AquaFlow</a></li>
            </ul>
        </li>
    </ul>
    <section id="catalog"></section>

这是我的脚本：

$('a.ext').click(function (event){
        event.preventDefault(); 
        $('#catalog').load(this.href);
});

$('.category > a').click(function(evt) {                 
    if ($(this).attr('class') != 'active'){
        $('#nav li ul').hide();
        $(this).next().show()
        // $(this).next('li > a').trigger('click')
        $('#nav li a').removeClass('active');
        $(this).addClass('active');
    };
    if ($('#indoor').attr('class') == 'active'){
        $("#commercialBanner img").attr("src", "images/catalog/indoorBanner.jpg");
    };  
    if ($('#outdoor').attr('class') == 'active'){
        $("#commercialBanner img").attr("src", "images/catalog/outdoorBanner.jpg");
    };  
});

【问题讨论】：

这就是全部代码吗？看起来不像。
你应该使用hasClass("active")
使用alert() 或console.log() 确保这些行被调用。

标签： javascript

【解决方案1】：

您似乎错误地检查了类属性 - 您在一个元素上有多个类，所以：

$('#indoor').attr('class') is 'ext active' or 'ext'

正如@epascarello 所说：使用 hasClass("active")。

看这个：

jQuery's attr - return multiple classes not just the 1st

【讨论】：