如何避免使用模式隐藏按钮及其动作？

Question

我是编码的初学者，我必须准备一个POC。我对模态有一些疑问。从他的创作中，我无法再单击某些已有的按钮。有人知道即使模态出现时如何保持这些按钮可用？我可以看到它们，但无法再单击它们（它们似乎位于模式后面）。您可以在随附的图片上看到它。 按钮包含在我从开放的Autodesk API中获得的javascript源代码中），模态是我自己编码成html文件。

我环顾四周，但一无所获。我还尝试将z-index调整为模态，但是什么也没发生。

我希望在创建模态时保留onclick动作并允许该动作本身。

function prepareAppBucketTree() {
  $('#appBuckets').jstree({
    'core': {
      'themes': { "icons": true },
      'data': {
        "url": '/api/forge/oss/buckets',
        "dataType": "json",
        'multiple': false,
        "data": function (node) {
          return { "id": node.id };
        }
      }
    },
    'types': {
      'default': {
        'icon': 'glyphicon glyphicon-question-sign'
      },
      '#': {
        'icon': 'glyphicon glyphicon-cloud'
      },
      'bucket': {
        'icon': 'glyphicon glyphicon-folder-open'
      },
      'object': {
        'icon': 'glyphicon glyphicon-file'
      }
    },
    "plugins": ["types", "state", "sort", "contextmenu"],
    contextmenu: { items: autodeskCustomMenu }
  }).on('loaded.jstree', function () {
    $('#appBuckets').jstree('open_all');
  }).bind("activate_node.jstree", function (evt, data) {
    if (data != null && data.node != null && data.node.type == 'object') {
      $("#forgeViewer").empty();
      var urn = data.node.id;
      getForgeToken(function (access_token) {
        jQuery.ajax({
          url: 'https://developer.api.autodesk.com/modelderivative/v2/designdata/' + urn + '/manifest',
          headers: { 'Authorization': 'Bearer ' + access_token },
          success: function (res) {
            if (res.status === 'success') launchViewer(urn);
            else $("#forgeViewer").html('Conversion en cours: ' + res.progress + '. Merci de réessayer plus tard.');
          },
          error: function (err) {
            var msgButton = 'Fichier pas encore convertis! ' +
              '<button class="btn btn-xs btn-info" onclick="translateObject()"><span class="glyphicon glyphicon-eye-open"></span> ' +
              'Start translation</button>'
            $("#forgeViewer").html(msgButton);
          }
        });
      })
    }
  });
}

function autodeskCustomMenu(autodeskNode) {
  var items;

  switch (autodeskNode.type) {
    case "bucket":
      items = {
        uploadFile: {
          label: "Télécharger",
          action: function () {
            uploadFile();
          },
          icon: 'glyphicon glyphicon-cloud-upload'
        }
      };
      break;
    case "object":
      items = {
        translateFile: {
          label: "Convertir",
          action: function () {
            var treeNode = $('#appBuckets').jstree(true).get_selected(true)[0];
            translateObject(treeNode);
          },
          icon: 'glyphicon glyphicon-eye-open'
        }
      };
      break;
  }

  return items;
}

function uploadFile() {
  $('#hiddenUploadField').click();
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- Navigation bar: https://getbootstrap.com/examples/navbar-fixed-top/ -------------------------------------------------------------------------->
  <nav class="navbar navbar-default navbar-fixed-top">
    <div id="navigation" class="container-fluid">
      <div id="leftSide">
        <button id="navbaricons" type="button" class="glyphicon glyphicon-menu-hamburger" data-toggle="modal" data-target="#myModal" onclick="masquer_div('Arborescence')"></button>
        <a href="http://www.overdrive.fr/accueil/" target="_blank">
        <img alt="Logo Overdrive" src="img/logo_overdrive_blanc.png"></a>
        <a id="nom">- bimDrive -</a>
        <button id="navbaricons" class="glyphicon glyphicon-user" style="float: right" onclick="document.getElementById('id01').style.display='block'"></button>
        <button id="navbaricons" type="button" class="glyphicon glyphicon-map-marker" style="float: right" data-toggle="modal" data-target="#MapModal" onclick="masquer_div('MiniMap')"></button>
        </div>
    </div>
  </nav>
<!-- END of navigation bar ----------------------------------------------------------------------------------------------------------->


<!-- Arborescence Modal -------------------------------------------------------------------------------------------------------------->
<div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="false">
  <div class="arbomodal-dialog">

<!-- Modal content---------------------------------------------------------------------------------------------------------------------->
    <div class="arbomodal-content">
      <div class="modal-header" data-toggle="tooltip">
          <button class="glyphicon glyphicon-plus-sign" style="float: left" id="showFormCreateBucket" data-toggle="modal" data-target="#createBucketModal"></button>Maquettes
          <span id="refreshBuckets" class="glyphicon glyphicon-refresh" style="cursor: pointer; float: right"></span>
      </div>

      <div id="appBuckets" class="modal-body"></div>

    </div> 
  </div>
</div>