javascript - 如何在 html 中打开仪表板主页时显示空 View ？

Question

首次运行时，主页仪表板会在侧面菜单中显示元素详细信息和所选元素名称。这是当前显示 的屏幕截图

我真正需要的是

这是我使用的代码:

<div class="container-fluid">
  <div class="row">
    <nav class="col-md-2 d-none d-md-block bg-light sidebar">
      <div id="projectlist" class="sidebar-sticky">
        <ul class="nav flex-column nav-pills">


          <li class="nav-item">
            <a name="EventDrivenLLC" class="nav-link active" href="#">

              <img class="img-fluid" style="width:8%" src="./Cloud Thrifty_files/generic_gcp.png">
              EventDrivenLLC

              <div>
                <small>
                ProjectId:
              </small>
              </div>
            </a>
            </li>

          <li class="nav-item">
            <a name="NickaJack" class="nav-link" href="#">

              <img class="img-fluid" style="width:8%" src="./Cloud Thrifty_files/generic_gcp.png">
              NickaJack

              <div>
                <small>
                ProjectId:
              </small>
              </div>
            </a>
            </li>

          <li class="nav-item">
            <a name="NickaJack" class="nav-link" href="#">

              <img class="img-fluid" style="width:8%" src="./Cloud Thrifty_files/generic_gcp.png">
              NickaJack

              <div>
                <small>
                ProjectId:
              </small>
              </div>
            </a>
            </li>

          <li class="nav-item">
            <a name="alarmist" class="nav-link" href="#">

              <img class="img-fluid" style="width:8%" src="./Cloud Thrifty_files/generic_gcp.png">
              alarmist

              <div>
                <small>
                ProjectId: alarmist-172522
              </small>
              </div>
            </a>
            </li>

选择元素时显示的详细信息 - 列出的元素是从侧边菜单中列出的，如果选择了任何侧边菜单元素，则会显示元素的详细信息并突出显示元素。

      <div id="decodingideas-147616" class="d-none justify-content-between flex-wrap flex-md-nowrap align-items-center pb-2 mb-3 border-bottom ">
        <h1 class="h2">Project:decodingideas</h1>



    <div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups">
      <div class="btn-group mr-2" role="group" aria-label="First group">
        <button type="button" class="btn btn-secondary">Compute API Enabled</button>
      </div>
      <div class="btn-group mr-2" role="group" aria-label="Second group">
        <button type="button" class="btn btn-secondary">Service Account Key</button>
      </div>
      <div class="btn-group" role="group" aria-label="Third group">
        <button type="button" class="btn btn-secondary">Other Errors</button>
      </div>
    </div>

---

<div class="container">
<h4>Compute Instances (0)</h4>
<table class="table table-striped h6">
<thead>
  <tr>
    <th scope="col">Name</th>
    <th scope="col">Type</th>
    <th scope="col">GCP Zone</th>
    <th scope="col">Startup</th>
    <th scope="col">Shutdown</th>
  </tr>

Answer 1

仔细查看您的代码。看看你有什么:

<a name="EventDrivenLLC" class="nav-link active" href="#">

并将其更改为:

<a name="EventDrivenLLC" class="nav-link" href="#">

我不确定这是否会完全修复它，因为我没有看到该页面的完整编码，但请先尝试一下。