为了账号安全,请及时绑定邮箱和手机立即绑定

求教使用jQuery如何实现鼠标事件以下功能,具体可见下面!

求教使用jQuery如何实现鼠标事件以下功能,具体可见下面!

HUWWW 2021-06-09 11:07:04
要求:一张图片1、单击该图片,图片样式(如边框颜色变红)改变,再单击一次,返回原来样式(如边框颜色变回原来的蓝色);2、当图片处于边框是红色的情况下。没有mouseover和mouseout事件3、当图片处于边框是蓝色的情况下,mouseover将边框变红,mouseout将边框变回原来的蓝色。应该怎么实现?在3中,还有click事件,click将边框变红后,即鼠标单击图片使边框变红后,不会发生mouseout再将边框变蓝。
查看完整描述

1 回答

?
慕森王

TA贡献1777条经验 获得超3个赞

你这逻辑有点问题,或者表达有点问题,
问:如果当边框为蓝色时,鼠标放上去为红色,此时点击的话,边框是否变回蓝色?
答:

不变,保留红色,此时属于你的附加条件,不应该有mouseout事件,那mouseover是否需要,需要的话有属于mouseover事件,那mouseout事件有应该有。

其实,你要的挺简单,可能没有描述清楚。以下是不包括你附加条件的js代码,如果要的话,请逻辑描述清楚,再给你写

var c = 0; //蓝色
$(function () {
$("#img").click(function () {
if (c == 0) {
$(this).css("border-color", "red");
c = 1;
}
else {
$(this).css("border-color", "blue");
c = 0;
}

});
$("#img").mouseover(function () {
if (c==0) {
$(this).css("border-color", "red");
}
});
$("#img").mouseout(function () {
if (c == 0) {
$(this).css("border-color", "blue");
}
});
});



查看完整回答
反对 回复 2021-06-14
  • 1 回答
  • 0 关注
  • 308 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信