Bootstrap Table 添加边框的数据-URL 选项

Question

在我的页面上，我有两个使用 Bootstrap Table 制作的 table。其中一个我手动将数据输入到行和列中，另一个填充 data-toggle="table" data-url="working-url.php"。他们都有class table-borderless，但是当生成带有数据-url的table时，似乎添加了class table-bordered自动地。正如预期的那样，另一个 table 没有边框。

有没有办法改变这种行为？

编辑：这是我的源代码：

<table data-toggle="table"
  data-url="working-url.php"
  class="table table-borderless table-striped">
  <thead>
    <tr>
      <th scope="col-2" data-field="statistic">Statistic</th>
      <th scope="col-2" data-field="value">Value of Stat</th>
    </tr>
  </thead>
</table>

但是当我加载页面然后检查元素时，我得到了这个：

<table data-toggle="table" 
  data-url="working-url.php" 
  class="table table-borderless table-striped table-bordered table-hover"> 
  ...
</table>

Answer 1

她是从您的数据中 removeClass() 的有效方法，这些数据是通过 bootstrap 4.

添加的

您可以使用 JS 或 jQuery。

只需运行下面的代码片段即可查看操作。您可以将以下 JS 或 jQuery 代码添加到您的 table 以手动移除您不想要的类。

此外，我已经为您添加了一个 ID 名为 my_table 的 table 这是为了确保我们只从中删除 class table-bordered一个 table 而不是你页面上的每个 table - 如果有的话

//jQuery//
$('#my_table').removeClass('table-bordered')

//Javascript Version//
var element = document.getElementById("my_table");
element.classList.remove("table-bordered");

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>

<table data-toggle="table" data-url="working-url.php" class="table table-borderless table-striped table-bordered table-hover" id="my_table">
  <thead>
    <tr>
      <th scope="col-2" data-field="statistic">Statistic</th>
      <th scope="col-2" data-field="value">Value of Stat</th>
    </tr>
  </thead>
</table>

希望对您有所帮助。

Bootstrap Table 添加边框的数据-URL 选项

Data-URL option on Bootstrap Table adding borders

javascript

html

css

bootstrap-table