Question

当我折叠部分时，其卡住了一半，但在我的朋友个人电脑上使用了Chrome 74。

我尝试更新Windows并重新安装chrome，但它仍然卡住。但是当我将chrome降级到73时，它的工作

            <div class="row accordian-row">
                <div class="col-lg-12 col-md-12 px-0">
                    <p class="my-0">
                        <a class="btn btn-link btn-collapse card-header" data-toggle="collapse"
                            href="#itemInfo" role="button" aria-expanded="false"
                            aria-controls="itemInfo" th:text="#{feature.material.item-store-maintenance-page.accordian-row.itemInfo}" ></a>
                    </p>
                </div>
                <div class="col-lg-12 col-md-12 collapse show py-3 accordian-border" id="itemInfo">
                    <form th:action="@{/material-item-store-maintenance/validate}" method="post" id="form1" >
                        <div class="row">
                            <div class="col-xl-9 col-lg-6 col-md-8 col-sm-9">
                                <div class="form-group-xs form-row">
                                    <label class="col-xl-3 col-lg-5 col-md-6 col-sm-2 col-form-label col-form-label-xs"
                                        for="item"><span class="text-danger" th:text="#{feature.material.item-store-maintenance-page.label.item} + '*'"></span></label>
                                    <div class="col-xl-9 col-lg-7 col-md-6 col-sm-10">
                                        <input type="text" name="itemInfoExt" id="itemInfoExt"
                                            placeholder="" 
                                            class="validate[required] form-control form-control-xs" />
                                    </div>
                                </div>
                            </div>
                            <div class="col-xl-3 col-lg-6 col-md-4 col-sm-3">
                                <div class="btn-group-sm float-right">
                                    <button type="reset" class="btn btn-secondary" th:text="#{feature.material.item-store-maintenance-page.button.clearAll}" onclick="clearAllForm()" ></button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

Answer 1

无法在运行于MS Windows 10 Pro的Chrome版本74.0.3729.157（官方内部版本）（64位）上进行重现-代码已进行2次更改

将背景色添加到可折叠区域
在切换按钮上添加了“打开/关闭”标签

#itemInfo {
  background: lightpink
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

<div class="container">
  <h2>Collapsible</h2>

  <div class="row accordian-row">
    <div class="col-lg-12 col-md-12 px-0">
      <p class="my-0">
        <a class="btn btn-link btn-collapse card-header" data-toggle="collapse" href="#itemInfo" role="button" aria-expanded="false" aria-controls="itemInfo" th:text="#{feature.material.item-store-maintenance-page.accordian-row.itemInfo}"> OPEN/CLOSE</a>
      </p>
    </div>
    <div class="col-lg-12 col-md-12 collapse show py-3 accordian-border" id="itemInfo">
      <form th:action="@{/material-item-store-maintenance/validate}" method="post" id="form1">
        <div class="row">
          <div class="col-xl-9 col-lg-6 col-md-8 col-sm-9">
            <div class="form-group-xs form-row">
              <label class="col-xl-3 col-lg-5 col-md-6 col-sm-2 col-form-label col-form-label-xs" for="item"><span class="text-danger" th:text="#{feature.material.item-store-maintenance-page.label.item} + '*'"></span></label>
              <div class="col-xl-9 col-lg-7 col-md-6 col-sm-10">
                <input type="text" name="itemInfoExt" id="itemInfoExt" placeholder="" class="validate[required] form-control form-control-xs" />
              </div>
            </div>
          </div>
          <div class="col-xl-3 col-lg-6 col-md-4 col-sm-3">
            <div class="btn-group-sm float-right">
              <button type="reset" class="btn btn-secondary" th:text="#{feature.material.item-store-maintenance-page.button.clearAll}" onclick="clearAllForm()"></button>
            </div>
          </div>
        </div>
      </form>
    </div>
  </div>
</div>

更新至Google Chrome浏览器74版本后，崩溃时data-toggle =“ collapse”不能停留在一半

1 个答案: