Question

我在引导程序崩溃中有两个按钮（＆＃39; x＆＃39;，＆＃39;取消＆＃39;），应该切换并关闭可折叠的按钮。第一个按钮显示为＆＃39; x＆＃39;工作正常，关闭可折叠，但取消＆＃39;不会关闭可折叠区域。有什么想法吗？这是我尝试设置的fiddle。另一个问题是，当＆＃39; x＆＃39;关闭可折叠区域然后我再次打开它，缺少自举井。任何想法为什么会这样？

＆＃13;

$(document).on("click", "button.cancel-student-button", function() {
  var collapse = $(this).closest("collapse");
  $(collapse).collapse('toggle');
});

＆＃13;

<div class="collapse cborder" id=cancellation style="position:relative">
  <div class="unregster-student-well well" style="margin-bottom: 0; border: 1px solid yellowgreen;">
    <div class="unregister-student-alert alert alert-danger alert-dismissible fade in" role="alert">
      <button type="button" class="cancel-student-button close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span>
      </button>
      <h4>Oh snap! You want to unregister as a student!</h4>
      <p>Press the unregister button and you will be automatically unregistered from this YogaBandy event.</p>
      <p>
        <button type="button" class="btn btn-danger">Unregister</button>
        <button type="button" class="cancel-student-button btn btn-default">Cancel</button>
      </p>
    </div>
  </div>
</div>

＆＃13;

Answer 1

你有一些事情应该改变：

1）您的数据目标周围没有括号：id=cancellation。

2）closest("collapse");需要一段时间来表示班级

3）你在这里不需要button＆gt; ".cancel-student-button"

4）并删除data-dismiss="alert"。

＆＃13;

$(document).on("click", ".cancel-student-button", function() {
  var collapse = $(this).closest(".collapse");
  $(collapse).collapse('toggle');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<hr>
<button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#cancellation" aria-expanded="false" aria-controls="collapseExample">Button with data-target</button>
<div class="collapse cborder" id="cancellation" style="position:relative">
  <div class="unregster-student-well well" style="margin-bottom: 0; border: 1px solid yellowgreen;">
    <div class="unregister-student-alert alert alert-danger alert-dismissible fade in" role="alert">
      <button type="button" class="cancel-student-button close" aria-label="Close"><span aria-hidden="true">×</span>

      </button>
      <h4>Oh snap! You want to unregister as a student!</h4>

      <p>Press the unregister button and you will be automatically unregistered from this YogaBandy event.</p>
      <p>
        <button type="button" class="btn btn-danger">Unregister</button>
        <button type="button" class="cancel-student-button btn btn-default">Cancel</button>
      </p>
    </div>
  </div>
</div>
<hr>

＆＃13;

我的引导程序崩溃在点击按钮时没有正确切换和关闭

1 个答案: