我正在寻找一种方法,在点击某些内容时运行两个单独的操作/函数/"代码块",然后在再次单击相同的内容时运行完全不同的块.我把它放在一起.我想知道是否有更有效/更优雅的方式.我知道jQuery .toggle()但它有点糟糕.
在这里工作:http: //jsfiddle.net/reggi/FcvaD/1/
var count = 0;
$("#time").click(function() {
count++;
//even odd click detect
var isEven = function(someNumber) {
return (someNumber % 2 === 0) ? true : false;
};
// on odd clicks do this
if (isEven(count) === false) {
$(this).animate({
width: "260px"
}, 1500);
}
// on even clicks do this
else if (isEven(count) === true) {
$(this).animate({
width: "30px"
}, 1500);
}
});
Run Code Online (Sandbox Code Playgroud) 我想在我的网页中的两个功能之间切换,但我不知道如何...
代码:
<html lang="en">
<head>
<meta charset="UTF-8"/>
<link rel="stylesheet" type="text/css" media="screen" href="/css/style.css"/>
<title>My Project</title>
<script>
function openNav() {
document.getElementById("mySidenav").style.width = "250px";
document.getElementById("main").style.marginLeft = "250px";
document.body.style.backgroundColor = "rgba(0,0,0,0.4)";
}
function closeNav() {
document.getElementById("mySidenav").style.width = "0";
document.getElementById("main").style.marginLeft = "0";
document.body.style.backgroundColor = "white";
}
</script>
</head>
<body>
<div id="main">
<div class="head">
<span class="openbtn" id="navbtn" onclick="openNav(); closeNav(); ">?</span>
<p> Do Re Mi Fa So Laa</p>
</div>
</div>
<div id="mySidenav" class="sidenav">
<a href="javascript:void(0)" class="openbtn" onclick="closeNav()">?xx</a>
<a href="#">About</a>
<a href="#">Services</a>
<a href="#">Clients</a>
<a href="#">Contact</a>
</div>
</body> …Run Code Online (Sandbox Code Playgroud)