当点击opacity: 0.5时，如何将它添加到li中，并在动画再次单击时将不透明切换回opacity:1？
$('li').on('click', function () {
$(this).animate({
opacity: 0.5
}, 500, function () {
$(this).toggleClass('completed');
});
});是否有任何简单的解决方案，比如在类之间切换，还是需要添加逻辑来检查当前的不透明度并进行相应的更改？我不想更改标记或CSS，但希望通过jQuery来实现。
回答 3
Stack Overflow用户
回答已采纳
发布于 2016-04-21 10:53:53
我们可以用数学来表示:)
$('li').on('click', function () {
$(this).animate({
opacity: (0.5 / $(this).css("opacity"))
}, 500, function () {
$(this).toggleClass('completed');
});
});Stack Overflow用户
发布于 2016-04-21 10:49:19
你可以像下面这样做。
$('li').on('click', function () {
if ($(this).is(':animated')) return; //ignore click while animating
var opacity = $(this).css('opacity') == 1 ? 0.5 : 1;
$(this).animate({
opacity: opacity
}, 500, function () {
$(this).toggleClass('completed');
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li>Click Here</li>
<li>Click Here</li>
</ul>
Stack Overflow用户
发布于 2016-04-21 10:46:24
你只需要一面旗子
$('li').on('click', function () {
var opacity,
flag = $(this).data('flag');
if ( flag ) {
opacity = 1;
} else {
opacity = 0.5;
}
$(this).animate({
opacity: opacity
}, 500, function () {
$(this).toggleClass('completed');
$(this).data('flag', !flag);
});
});(故意说得很详细)
$('li').on('click', function () {
var opacity,
flag = $(this).data('flag');
if ( flag ) {
opacity = 1;
} else {
opacity = 0.5;
}
$(this).animate({
opacity: opacity
}, 500, function () {
$(this).toggleClass('completed');
$(this).data('flag', !flag);
});
});li {color : red; cursor: pointer; margin: 20px 0 0 0;}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li>Click to fade</li>
<li>Click to fade</li>
<li>Click to fade</li>
<li>Click to fade</li>
<li>Click to fade</li>
<li>Click to fade</li>
</ul>
较少冗长的版本
$('li').on('click', function () {
var flag = $(this).data('flag');
$(this).fadeTo(500, flag ? 1 : 0.5, function() {
$(this).toggleClass('completed').data('flag', !flag);
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/36777941
复制
腾讯云开发者
