怎样给一个div加鼠标时间，让鼠标点击div之后更换底背景？再点击一下回复原来的底背景。
如题，我在做一个商城的商品陈列，用ul写的，li的里面有div还有按钮，所以我想给li做一个鼠标点击事件，让用户点击该商品的任意地方，li底背景变成另一个颜色的图片，再点...
如题，我在做一个商城的商品陈列，用ul写的，li的里面有div还有按钮，所以我想给li做一个鼠标点击事件，让用户点击该商品的任意地方，li底背景变成另一个颜色的图片，再点击一次取消。或是点击其他的，刚才的li自动变成原来的底背景。
展开
1个回答
展开全部
<body>
<div>abc</div>
<script type=text/javascript>
div= document.getElementsByTagName('div')[0];
var toggle_bg=false;
div.style.backgroundColor='#eee000';
div.onclick=toggle_div_bg;
function toggle_div_bg(){
if (toggle_bg){
this.style.backgroundColor='#eee000';
this.style.backgroundImage='';
toggle_bg=false;
}else{
this.style.backgroundImage= "url('bg.jpg')";
toggle_bg=true;
}
}
</script>
</body>
以上代码实现了点击div 切换背景颜色和背景图片。图片为 bg.jpg
<div>abc</div>
<script type=text/javascript>
div= document.getElementsByTagName('div')[0];
var toggle_bg=false;
div.style.backgroundColor='#eee000';
div.onclick=toggle_div_bg;
function toggle_div_bg(){
if (toggle_bg){
this.style.backgroundColor='#eee000';
this.style.backgroundImage='';
toggle_bg=false;
}else{
this.style.backgroundImage= "url('bg.jpg')";
toggle_bg=true;
}
}
</script>
</body>
以上代码实现了点击div 切换背景颜色和背景图片。图片为 bg.jpg
追问
我不太动js，我这里是这样写的，请问怎么应用你的这段代码呢？
奇瑞QQ
价格：12000.00
购买赠送
追答
可以在body 结束tag 之前加上函数定义和变量定义以及事件加载：
奇瑞QQ
价格：12000.00
购买赠送
var toggleBg = true;
var bgColor = '#eee000'; // 背景颜色
var bgImage = 'bg.jpg'; // 背景图片
var li_bg = document.getElementById('li_bg')
toggle_div_bg.apply(li_bg);
li_bg.onclick=toggle_div_bg;
function toggle_div_bg(){
if (toggleBg){
alert(1);
this.style.backgroundColor=bgColor;
this.style.backgroundImage='';
toggleBg = false;
}else{
alert(2);
this.style.backgroundImage= "url(" + bgImage + ")";
this.style.backgroundColor = '';
toggleBg = true;
}
}
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
