Question

我正在尝试使用asp.net创建一个系统，我想使用手风琴。

我希望我的手风琴有一个带有复选框的标题，然后选中该复选框后，它将在内容部分显示复选框，因此它将如下所示：

-HEADER

 -CONTENT

 -CONTENT

 -CONTENT

-header

 -CONTENT

 -CONTENT

 -CONTENT

但是，显示的标题取决于另一个复选框中的选择以及两个标题＆＃39;在这个例子中将是同一个手风琴。是否有可能做到这一点？我需要能够选择多个复选框，所以我不确定使用复选框或复选框列表是否是最好的方法

对不起，如果我没有说清楚自己如果您需要更多信息，请告诉我

非常感谢

Answer 1

请尝试使用此html代码

<link href = "https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" rel = "stylesheet" />
<script src = "https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<div id="accordion">
    <h3>
        <label for='product-44-44'>
            <input type='checkbox'  name="header" value="header" id="header"/>
            HEADER
        </label>
    </h3>
    <div class="columns">
        <div class="d1">
            <label>
                <input type="checkbox" name="content1" value="content1" id="content1">
                CONTENT 1
            </label>
        </div>
        <div class="d1">
            <label>
                <input type="checkbox" name="content2" value="content2" id="content2">
                CONTENT 2
            </label>
        </div>
    </div>
</div>
$("#accordion")
            .accordion({
                collapsible: true,
                active: false,
                heightStyle: "content",
                beforeActivate: function (event, ui) {
                    var oldInput = ui.oldHeader.find('input');
                    oldInput.prop('checked', !oldInput.prop('checked')) // this bit unchecks when the accordion is closed

                    var newInput = ui.newHeader.find('input'); // this bit checks when the accordion is opened
                    newInput.prop('checked', !newInput.prop('checked'))
                }
            });

尝试运行代码以单击此链接 https://jsfiddle.net/sunnykalariya/5v9aqjkf/

手风琴中的复选框

1 个答案: