如何切换jQuery

我想点击一个按钮（或者在我下面的例子中，一个链接），并在2个内容块之间切换，基本上从显示内容到编辑内容。

我有以下代码片段：

 div.show {display:block;} input.hide {display:none;}  edit  
Some content
  

谢谢你的帮助。

[请参阅如何简化和压缩重复jQuery代码以扩展到此技术]

Answer 1

使用jQuery很容易添加以下JS代码：

 $(document).ready(function(){ $('#button').on('click', function() { $('#d-01-on').toggle(); $('#d-01-off').toggle(); }); }) 

它将与您当前的标记和CSS代码一起使用。

Answer 2

使用jquery显示和隐藏元素的过程如下：

HTML：

 
content 

使用Javascript：

 $.("#d-01").toggle(); //toggles display so if shown then hides, if hidden then shows; $.("#d-01").show(); //shows div $.("#d-01").hide(); //hides div 

Answer 3

这将切换两个元素的可见性：

 function handleClick() { $('div.show').toggle(); $('input.hide').toggle(); } 

那么你的class级名称当然是错的。 您可以改用ID。