小编sj2*_*012的帖子

扩展和折叠功能目前工作正常,但我想修改功能,所以当我点击Expand 1,然后点击Expand 2,它Expand 1应该自动崩溃.这意味着只div允许一个扩展,而其他所有其他应保持折叠状态.

HTML:

<div class="container">
<div class="header"><span>Expand 1</span>

</div>
<div class="content">
    <ul>
        <li>This is just some random content.</li>
        <li>This is just some random content.</li>
        <li>This is just some random content.</li>
        <li>This is just some random content.</li>
    </ul>
</div>

 <div class="header"><span>Expand 2</span>

</div>
<div class="content">
    <ul>
        <li>This is just some random content.</li>
        <li>This is just some random content.</li>
        <li>This is just some random content.</li>
        <li>This is just some random content.</li>
    </ul> …

我想完成，当我尝试选中复选框时，它会显示弹出窗口。然后，有“是”和“否”两个选项。当我单击“是”复选框时，将选中并关闭弹出窗口。如果我选择“否”复选框将取消选中并关闭弹出窗口。给我一个帮助。示例代码在这里

Javascript

$(document).ready(function () {
$('#chkBox').click(function () {
    if ($(this).is(':checked')) {
        $("#txt").dialog({
            close: function () {
                $('#chkBox').prop('checked', false);
            }
        });
    } else {
        $("#txt").dialog('close');
    }
});
});

HTML

<input type="checkbox" id="chkBox" name="HelpCheckbox" value="Help" />
  <div id="txt" style="display: none;">
       <button>Yes</button>
        <button>NO</button>
  </div>

现场示例：http : //jsfiddle.net/5vy1m233/37/

请帮忙。谢谢你。