我的问题非常简短：
如果我点击“显示”，我想将其更改为“隐藏”。同样，如果我点击“隐藏”，我想将其更改为“显示”？
例如toggleClass。
答案 0 :(得分：3)
使用jQuery函数toggle() DOCs：
$('a.toggle').click(function(){
$('div').toggle();
});
<a href="#" class="cycle">Cycle</a>
<div>Text1</div>
var div = $('div');
var options = [div.html(), 'text2'];
var curr_opt = 1;
$('a.cycle').click(function(){
div.text(options[curr_opt]);
curr_opt++;
if(!options[curr_opt]) {
curr_opt = 0;
}
});
上面的代码将允许您切换一些文本，但是如果您愿意，可以向options数组添加额外的选项以创建一个循环。
以下是您可以为代码运行的jsfiddle：http://jsfiddle.net/c3ctT/
答案 1 :(得分：0)
编辑修复了代码。
的jQuery
$('#toggle').html($('#toggle').html() == 'show' ? 'hide' : 'show');
HTML
<span id="toggle">show</span>
答案 2 :(得分：0)
约瑟夫，请，检查这是你想要的。
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<style>
</style>
<script type="text/javascript">
$(document).ready(function() {
$("#showHide").html("SHOW");
$("#showHide").click(function(){
$("#content").toggle();
if($("#content").is(":hidden"))
$("#showHide").html("SHOW");
else
$("#showHide").html("HIDE");
});
});
</script>
</head>
<body>
<div id="showHide"></div>
<div id="content">
content content..content content..content content..content content.. content content..content content..content content..content content..
</div>
</body>
</html>
只有SHOW / HIDE切换所需的代码。
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<style>
</style>
<script type="text/javascript">
$(document).ready(function() {
$("#showHide").click(function(){
if($(this).html()=="SHOW")
$(this).html("HIDE");
else $(this).html("SHOW");
});
});
</script>
</head>
<body>
<div id="showHide">SHOW</div>
</body>
</html>
答案 3 :(得分：0)
elem.addEventListener("click", function toggle() {
this.classList.toggle("hidden");
});