twitter-bootstrap-3 相关问题

<pre><code><table id="selectCaseTable" class="table table-bordered table-striped table-hover">  </table>  <script src="/static/adminlet-2.4.10/bower_components/jquery/dist/jquery.min.js"></script>  <script src="/static/adminlet-2.4.10/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>  <script src="/static/adminlet-2.4.10/dist/js/adminlte.min.js"></script> <script src="/static/adminlet-2.4.10/bower_components/datatables.net/js/jquery.dataTables.min.js"></script> <script src="/static/adminlet-2.4.10/bower_components/jquery-slimscroll/jquery.slimscroll.min.js"></script> <script src="/static/adminlet-2.4.10/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>  <script src="/static/adminlet-2.4.10/bower_components/fastclick/lib/fastclick.js"></script>  <script src="/static/adminlet-2.4.10/dist/js/demo.js"></script> <srcipt> fuctions addSelectCase(){ ... $("#selectCaseTable").bootstrapTable('refresh'); } </script> </code></pre> <p>当我像下面那样打电话给<pre><code>bootstrapTable("refresh")</code></pre></p> <pre><code>$("#selectCaseTable").bootstrapTable('refresh'); </code></pre> <p>我在控制台上看到错误</p> <blockquote> <p>TypeError: $(...).bootstrapTable 不是函数</p> </blockquote> </question> <answer tick="true" vote="4"> <p>你应该打电话给<pre><code>Datatable()</code></pre>而不是<pre><code>bootstrapTable()</code></pre>，如下面的代码所示：</p> <pre><code>var table = $('#example').DataTable(); table.ajax.reload(); </code></pre> <p>欲了解更多信息，请单击此处查看以前的<a href="https://stackoverflow.com/questions/12934144/how-to-reload-refresh-jquery-datatable">问题</a>.</p> </answer> <answer tick="false" vote="3"> <blockquote> <p>TypeError: $ (...).bootstrapTable 不是函数</p> </blockquote> <p>这个错误是在<pre><code>$('#example').DataTable();</code></pre>之后的初始<pre><code>bootstrapTable</code></pre>你必须包含</p> <pre><code><script src="https://unpkg.com/[email protected]/dist/bootstrap-table.min.js"></script> </code></pre> <p>之后调用<pre><code>$('#example').DataTable();</code></pre>函数。 </p> <p>对于任何未加载的脚本或函数来说，这是一个常见问题，但是您调用它然后客户端站点浏览器给出此错误。</p> <p><strong>谢谢</strong></p> </answer> <answer tick="false" vote="1"> <p>我只是在 jquery 相关文件之后添加了 bootstrap 相关文件（js 和 css），问题就消失了。</p> </answer> <answer tick="false" vote="0"> <p>你可以使用</p> <pre><code>$('button[name="refresh"]').click() </code></pre> <p>只有你需要摆在你的桌子上</p> <pre><code>data-show-refresh="true" </code></pre> </answer> <answer tick="false" vote="0"> <p>这对我有用：</p> <p></p><div data-babel="false" data-lang="js" data-hide="false" data-console="false"> <div> <pre><code>let table = $('#table').bootstrapTable({}); table.bootstrapTable('getData')</code></pre> </div> </div> <p></p> </answer> </body></html>

jquery twitter-bootstrap-3 adminlte

回答 0 投票 0

bootstrap 3 全宽图像和容器中的 div

我正在尝试将一些 div 设置为 width: 100% on Twitter Bootstrap 3（包括无填充或边距）。 JSfiddle：http://jsfiddle.net/rq9ycjcx/ HTML: 我正在尝试在 Twitter Bootstrap 3 上将一些 div 设置为width: 100%（包括无填充或边距）。 JSfiddle：http://jsfiddle.net/rq9ycjcx/ HTML： <div class="container"> <header> <div class="row"> <div class="col-md-2"> <img src="http://placehold.it/150x50"> </div> <div class="col-md-10">Menu</div> </div> <div class="row gray"> <div class="col-md-6"> <h1>Page Title</h1> </div> <div class="col-md-6"> <div class="breadcrumbs">Main page > page </div> </div> </div> <div class="row"> <div class="col-md-12"> <img src="http://placehold.it/350x150" /> </div> </div> </header> <footer> <div class="row"> <div class="col-md-12">Content</div> </div> <div class="row dark"> <div class="col-md-3">Footer 1</div> <div class="col-md-3">Footer 2</div> <div class="col-md-3">Footer 3</div> <div class="col-md-3">Footer 4</div> </div> </footer> </div> 获取图像的正确方法是什么http://placehold.it/350x150width: 100%，包括没有填充或边距？页面标题和面包屑高度为80px. 如果我将窗口大小调整为较小的屏幕（例如移动设备），文本Main page > page 消失（它在某处但不在自己的行上）。如何解决？使用<div class="container-fluid">。根据 Bootstrap 文档：使用 .container-fluid 作为全宽容器，跨越视口的整个宽度。 container-fluid上有0个填充。在您的代码中，您的 body 中似乎有 header 内容，并且在 div class="container" 和 header 之外还有一个 footer。这是不正确的，你的container/container-fluid应该在你的身体里面。同样对于您的标题，您应该使用<nav="nav navbar-nav">. 更新小提琴按照上面的建议，你可以创建一个辅助类 .padding-0 { padding: 0; } 并将其应用于任何需要重置填充的 HTML 元素。所以在你的情况下，它看起来像这样： <div class="row"> <div class="col-md-12 padding-0"> <img src="http://placehold.it/350x150" /> </div> </div> 对于第二个问题，将height类的.gray设置为auto： @media () { .gray { height: auto; } } 注意：您也可以删除line-height: 80px，它是可选的:) http://jsfiddle.net/rq9ycjcx/8/ 在 Bootstrap 3 中没有“正确”的方法来做到这一点。这意味着您必须为确切的列重置填充。您可以创建一个这样的类： .col-md-12.resetPadding { padding:0px } 关于 Main page > page 消失，我在我的浏览器上没有看到这个问题（在 Chrome 和 FF 上测试过），但是你有 line-height: 80px 并且正如你所说你的面包屑 div 有 height: 80px;，所以尽量减少 line-height 财产，看看它是如何运作的。一个简单的方法是删除 <div class="col-md-12">...</div> 并直接在行标签内添加您的内容。行标签移除了左右间距，而 cold-md-12 本质上是添加了间距。 Bootstrap 3 文档说，对于单个全宽项目，您不需要任何标记，例如，只需将其包装在 <p> 标签中。然而，由于页面标记，这将显示 15px 的间距。因此，只需添加 row 标签并将您的内容直接放入其中，您将获得 100% 宽度的内容并符合 BS3 文档。

css twitter-bootstrap twitter-bootstrap-3

回答 4 投票 0

如何在 Bootstrap 3 中制作全高产品块

如何使此代码处于全高状态（cms 是 OpenCart 2.1 并且正在使用 Bootstrap 3）？如何使这段代码处于全高状态（cms 是 OpenCart 2.1 并且使用的是 Bootstrap 3）？ <div class="row equal"> <div class="product-layout product-grid col-lg-3 col-md-4 col-sm-6 col-xs-12"> <div class="product-thumb"> <div class="image"></div> <div class="caption"></div> </div> </div> </div> CSS .row .equal { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-wrap: wrap; } .equal > [class*='col-'] { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .equal > [class*='col-'] > * { display: flex; flex-wrap: wrap; } CSS 不能使它全高 Currentl 看起来像这样

css twitter-bootstrap-3 flexbox opencart2.x

回答 0 投票 0

改变表格宽度bootstrap 4

我想在bootstrap 4中改变表格的宽度，如图所示，表格并没有使用所有页面的宽度，这是html中的代码。

html twitter-bootstrap twitter-bootstrap-3 bootstrap-4

回答 1 投票 1

如何调整bootstrap按钮的大小，而不需要侧滚动

我对CSS响应式布局非常陌生，需要帮助我构建导航条。我知道有许多其他类似的SO Q&As，但他们都没有给我想要的输出。我试过使用...

html css twitter-bootstrap-3 responsive

回答 1 投票 0

如何在HTML中获取按钮切换状态？

我使用Angular 7和Bootstrap 3.4。这是一个按钮切换器，这部分是语句的条件。