使用jQuery显示/隐藏字段集 [英] Show/hide a fieldset using jquery
本文介绍了使用jQuery显示/隐藏字段集的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有以下html代码:-
I have the following html code:-
<!DOCTYPE html>
<html>
<body>
<fieldset>
<legend>
<button>
Show/Hide form
</button>
</legend>
Name:
<input type="text" />
<br />
Email:
<input type="text" />
<br />
Date of birth:
<input type="text" />
</fieldset>
<fieldset>
<legend>
<button>
Show/Hide form
</button>
</legend>
Name:
<input type="text" />
<br />
Email:
<input type="text" />
<br />
Date of birth:
<input type="text" />
</fieldset>
<fieldset>
<legend>
<button>
Show/Hide form
</button>
</legend>
Name:
<input type="text" />
<br />
Email:
<input type="text" />
<br />
Date of birth:
<input type="text" />
</fieldset>
</body>
</html>
但是，如果用户单击显示/隐藏表单"按钮，我如何显示和隐藏字段集，并且有一种方法可以根据字段的当前状态将按钮标签更改为显示或隐藏放? BR
But how i can show and hide a field set if the user clicks on the "show/hide form" button AND is there a way to change the button label to be either show or hide based on the current status of the field set? BR
推荐答案
隐藏fieldset时，您的按钮也被隐藏.您可以修改标记并使用toggle方法:
When fieldset is hidden your button is hidden too. You can modify your markup and use toggle method:
<button class='toggle'>Hide</button>
<fieldset>
Name: <input type="text" /><br />
Email: <input type="text" /><br />
Date of birth: <input type="text" />
</fieldset>
$('.toggle').click(function(){
var $this = $(this);
$this.text( $this.text() == 'Show' ? "Hide" : "Show" )
$this.next().toggle()
})
这篇关于使用jQuery显示/隐藏字段集的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
