使用 JavaScript 隐藏/显示高级选项

我正在制作一个 HTML 表单，我希望某些字段位于“高级选项”下。我想创建一个“高级选项”链接，可能带有“加号”，这样当用户单击链接或符号时，就会显示这些高级字段。我怎样才能在 JavaScript 中做到这一点？我尝试在 Google 上搜索“隐藏/显示高级选项”之类的内容，但找不到解决方案。

<form ... />
    <label>
      Title 
      <input id="title" name="title" size="40" type="text" value="" /> 
    </label>
    <label>
      Year 
      <input id="year" name="year" size="20" type="text" value="" /> 
    </label>
    <label>
      Year 
      <input id="comment" name="comment" size="40" type="text" value="" /> 
    </label>
</form>

例如，这里我希望将“评论”字段提前。

<a href='#' class='advanced'>Advanced Options</a>

<div id='advancedOptions'><!-- Form stuff here --></div>

<script type='text/javascript'>
    $(document).ready(function () {
        $('#advancedOptions').hide();
        $('.advanced').click(function() {
            if ($('#advancedOptions').is(':hidden')) {
                 $('#advancedOptions').slideDown();
            } else {
                 $('#advancedOptions').slideUp();
            }
        });
    });
</script>

它将在加载时隐藏advancedOptions元素，当您单击a标签时，它将检查advancedOptions是否被隐藏，如果是，那么它将显示它，如果它没有隐藏，它将隐藏它。你会需要;

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 

在您正在使用的页面顶部，我知道它是 JQuery，但学习 JQuery 以供将来参考会很有用