Javascript 在可滚动表格中隐藏垂直滚动

我已经实现了一个可滚动的表，其中有一个固定的列，并启用了垂直和水平滚动。我想隐藏显示在固定列旁边的垂直滚动条。这是你的电话号码。 我的html如下所示：

<div class="col-md-12">
      <div class="col-md-3" style="padding:0;">
        <table class="table" style="margin-bottom:0;">
          <thead>
            <tr>
              <th>fixed</th>
            </tr>
          </thead>
        </table>
        <div style="height:100px; overflow-y:auto" id="fixed" on-scroll="">
          <table class="table" style="margin-bottom:0">
            <tbody>
              <tr data-ng-repeat="data in [1,2,3,4]">
                <td>data data data data data data data data</td>
              </tr>
            </tbody>
          </table>
        </div>
      </div>
      <div class="col-md-9" style="padding:0;overflow:hidden">
        <div id="topRight" style="padding:0;overflow-x:hidden" on-scroll="">
          <table class="table" style="margin-bottom:0">
            <thead>
              <tr>
                <th style="min-width:200px">column 1</th>
                <th style="min-width:200px">column 2</th>
                <th style="min-width:200px">column 3</th>
                <th style="min-width:200px">column 4</th>
                <th style="min-width:200px">column 5</th>
              </tr>
            </thead>
          </table>
        </div>
        <div style="height:100px; overflow:auto" id="bottomRight" on-scroll="">
          <table class="table" style="margin-bottom:0">
            <tbody>
              <tr data-ng-repeat="data in [1,2,3,4]">
                <td style="min-width:200px">data data data data data data data data</td>
                <td style="min-width:200px">data data data data data data data data</td>
                <td style="min-width:200px">data data data data data data data data</td>
                <td style="min-width:200px">data data data data data data data data</td>
                <td style="min-width:200px">data data data data data data data data</td>
              </tr>
            </tbody>
          </table>
        </div>
      </div>
    </div>

---

谢谢

这样做没有真正的跨浏览器解决方案，但您能找到的最佳答案是：

链接的回答 为完整起见，这适用于webkit：

元素：：-webkit滚动条{ 显示：无； } 如果要隐藏所有滚动条，请使用

：-webkit滚动条{ 显示：无； } 我不确定是否要恢复—这确实有效，但可能有一种正确的方法：

：-webkit滚动条{ 显示：块； } 当然，您可以始终使用width:0，这可以通过width:auto轻松恢复，但我不喜欢滥用width来调整可见性

若要查看当前浏览器是否支持此功能，请尝试以下代码段：

.内容{ /*这些规则创造了一个人工密闭空间，所以我们 我们可以隐藏的滚动条。它们不是隐藏本身的一部分*/ 边框：1px灰色虚线； 填充：.5em； 空白：预包装； 身高：5公分； 溢出y：滚动； } .content:：-webkit滚动条{ /*这是神奇的一点*/ 显示：无； } Lorem ipsum dolor sit amet，是一位杰出的献身者。毛里斯欧盟 乌尔纳和利奥·阿利奎特·马莱苏亚达和ac多洛。无弧舌苔 苏打发酵液。我只是坐在阿梅特·维尼纳蒂斯 埃格斯塔斯。时间完整的生命。在dapibus nisl坐着amet purus congue tincidunt。莫比在鲁特鲁姆点燃了爱欲。塞德·夸姆·埃拉特，福西布斯 暂时的，侵权的元素。在arcu eleifend的Praesent ac libero酒店 莫利斯·乌特·埃吉特·萨皮恩。欧盟临时议会 设施a。猫咪的排卵期是一个非常重要的元素 不。这是一种非常有效的方法。Integer porta viverra nunc， sed semper ipsum。Nam laoreet libero lacus。 塞德坐在阿梅特·汀西德蒙·菲利斯身边。这是我的饮食，是我的元素之门， 我爱你，我爱你，我爱你。奎斯克 nec magna erat。交通工具门的相位为零。塞德 菲尼布斯权杖。马萨·阿利夸姆·普雷蒂姆学院 帕特。两个元素是大元素，一个元素是小元素，另一个元素是权杖 奥迪奥·福西布斯。

---

更改溢出-y:隐藏，高度为150px

像

---

链接：

谢谢您的回答，但我想滚动并隐藏滚动条……您的解决方案禁用了水平滚动

<div style="height:150px; overflow-y:hide"  id="fixed" on-scroll="">
    <table class="table" style="margin-bottom:0">
      <tbody>
        <tr data-ng-repeat="data in [1,2,3,4]">
          <td>data data data data data data data data</td>
        </tr>
      </tbody>
    </table>
  </div>