使用jQuery在两个不同的点击事件之间切换? [英] Toggle between two different click events using jQuery?

问题描述

所以...我在尝试使用jQuery创建切换效果时遇到麻烦，该效果允许在li标签上的两个不同单击事件之间进行交替.再次单击以恢复到原始状态.

So...I am having a bit of trouble trying to create a toggle effect with jQuery that allows for the alternation between two different click events on an li tag.I want the li tag to fade to 0.5 opacity when clicked and when clicked again to revert back to the original state.

任何帮助将不胜感激，可以随时在jsfiddle上重新创建:D

Any help would be appreciated and feel free to recreate on jsfiddle :D

到目前为止，我的代码是:

The code that I have so far is:

HTML

<div>
    <li><a href="#">Click</a></li>
</div>

jQuery

$(document).ready(function() {
    $('li').toggle();
});

推荐答案

在继续之前检查其当前状态.

Check for its current state before proceeding.

此外，<li>的父元素必须具有<ul>或<ol>.

Also, <li>'s must have <ul> or <ol> as a parent element.

$('li').on('click', function(e){
  e.preventDefault();
  if($(this).css('opacity') != 1){
    $(this).fadeTo(300,1);
  }else{
    $(this).fadeTo(300,0.5);
  }
});

演示: http://jsfiddle.net/PZ96m/

这篇关于使用jQuery在两个不同的点击事件之间切换?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！