使用JQuery是()来改变背景图像

时间:2013-12-19 03:47:31

标签: javascript jquery html background-image

基本上,我尝试更改我的页面背景图像,每个标签点击不同的标签。我尝试使用条件和is()函数来识别特定的选项卡,但我没有运气。这是可行的,还是我错过了什么? P.S。:我正在使用jQuery 1.6.4。

HTML

  <body>
        <div id='pizza'>
            <div id='menu'>
                 <h1><p id='menuheading'>Menu</p></h1>
                <div class='tabbedmenu'>
                    <ul class='tabs'>
                        <li class='selected' id='pizzatab'>Pizza</li>
                        <li id='sandwichestab'>Sandwiches</li>
                        <li id='appetizerstab'>Appetizers</li>
                        <li id='saladstab'>Salads</li>
                        <li id='beveragestab'>Beverages</li>
                    </ul>
                </div>
                <div class='page' id='pizzatab' style='display:block'>
                    <p>yo</p>
                </div>
                <div class='page' id='sandwichestab' style='display:none'>
                    <p>hi</p>
                </div>
                <div class='page' id='appetizerstab' style='display:none'></div>
                <div class='page' id='saladstab' style='display:none'></div>
                <div class='page' id='beveragestab' style='display:none'></div>
            </div>
        </div>
    </body>
    </html>

的jQuery

$(document).ready(function () {
    $('.tabs li').click(function () {
        if ($(this).is('#sandwichestab')) {
            $('#pizza').css('background-image', 'url(http://hoagiexpress.tripod.com/sitebuildercontent/sitebuilderpictures/hoagies.jpg)');
        }
    });
});

1 个答案:

答案 0 :(得分:2)

你也可以这样做

$(this).attr('id') == 'sandwichestab'
点击功能

中的

您的原始代码也正常工作http://jsfiddle.net/raunakkathuria/46m5k/