有人能帮我理解为什么这个代码不工作吗?
$('#quick-search-header.widget-title').css('background-image', 'url(dd_includes/images/icons/sliding-menu-arrow-right.gif)');
我通过Firebug看到,背景图像已经从#quick-search-header.widget-title
中完全删除,但上面的新背景图像被添加到element.style
中。谢谢
HTML -
<div id="quick-search-header" class="widget-title">
<p>Quick search results</p>
</div>
CSS -
#quick-search-header.widget-title{
background: #C60B46 url(dd_includes/images/icons/sliding-menu-arrow-down.gif) right 3px no-repeat;
}
完整的JS(带有错误代码标记)-
$(document).ready(function(){
$('input#s').val('');
$('#quick-search-header.widget-title').live('click', function(){
if($('#quick-search-content').hasClass('visible')){
$('#quick-search-header.widget-title').css('background-image', 'url(dd_includes/images/icons/sliding-menu-arrow-right.gif)'); /** Not working */
$('#quick-search-content').removeClass('visible')
$('#quick-search-content').slideUp('600');
} else {
$('#quick-search-header.widget-title').css('background-image', 'url(dd_includes/images/icons/sliding-menu-arrow-down.gif)'); /** Not working */
$('#quick-search-content').addClass('visible')
$('#quick-search-content').slideDown('600');
}
});
});
3条答案
按热度按时间njthzxwz1#
通过jQuery中的
css('attributename','attributevalue')
函数设置任何值都会将该属性添加到元素的内联样式中。在检查器中,它经常被标记为element.style如果你只需要通过类来做这件事,那么你可以创建一个单独的类,在其中添加/删除元素中的类,并通过添加/删除元素中的类来切换类,这不会出现在元素.style中,而是只会切换类,并显示在检查器中。
您甚至可以使用
toggleClass()
函数,该函数允许您打开或关闭特定或多个类。文档如下:
toggleClass
addClass
removeClass
或者您甚至可以通过使用
.attr('class','newClassName');
在元素上设置一个属性来实现随你
2ledvvac2#
1.确保相对路径正确。对照当前位置检查10次相对路径:javascript:
window.location.pathname
1.尝试:首先将css定义为:
.XXX { background-image:url()}
然后在javaScript中:
backgroundImage =“url('../images/image.png')";//注意单引号
$(XXX).css(“background-image”,backgroundImage);
//或者
$(XXX).css({“background-image”:});
qnyhuwrf3#
尝试;