我想在每次单击图像时删除元素的现有类。
这是我的 HTML:
<img id="Iphone" src="Image/Technology/Iphone.png" class="technologyImage"/>
<img id="Android" src="Image/Technology/Android.png" class="technologyImage"/>
这是我的 JavaScript:
$(".technologyImage").click(function () {
$(this).removeClass();
$(this).addClass("technologySelected");
$(".technologyImage").css("opacity", "0.4");
$(".technologyImage").css("filter", "alpha(opacity=40)");
});
$(".technologySelected").click(function () {
alert("IMAGE IS ALREADY SELECTED");
});
如果用户单击所选图像,我想提醒用户。该代码不起作用,每次我单击图像时它也会转到 $(".technologyImage")
不在$(".technologySelected")
上.
最佳答案
确保您也重置了所选图像的不透明度。
<html>
<head>
<script type="text/javascript" src="./jquery.min.js"></script>
<script type="text/javascript">
$( document ).ready( function() {
$(".technologyImage").click( function(){
if($(this).hasClass( "technologySelected")){
alert("IMAGE IS ALREADY SELECTED");
}else{
$(".technologySelected")
.removeClass("technologySelected");
$(".technologyImage")
.css("opacity", "0.4")
.css("filter", "alpha(opacity=40)");
$(this)
.addClass("technologySelected")
.css("opacity", "1.0")
.css("filter", "alpha(opacity=100)");
}
});
});
</script>
</head>
<body>
<img id="Iphone" src="ios.jpg" class="technologyImage"/>
<img id="Android" src="android.jpg" class="technologyImage"/>
</body>
</html>
关于javascript - 如何删除类并添加另一个类jquery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22801194/