首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在bootgrid中的新选项卡中打开此链接

在bootgrid中打开新选项卡并加载链接的方法如下:

  1. 首先,确保你已经引入了jQuery和bootgrid库。
  2. 在HTML页面中创建一个bootgrid表格,并添加一个自定义的列来显示链接。例如:
代码语言:html
复制
<table id="myGrid" class="table table-condensed table-hover table-striped">
  <thead>
    <tr>
      <th data-column-id="id" data-type="numeric">ID</th>
      <th data-column-id="name">Name</th>
      <th data-column-id="link" data-formatter="linkFormatter">Link</th>
    </tr>
  </thead>
  <tbody>
    <!-- 表格数据行 -->
  </tbody>
</table>
  1. 在JavaScript中定义一个自定义的列格式化函数linkFormatter,用于将链接显示为可点击的文本。在该函数中,使用window.open()方法在新选项卡中打开链接。例如:
代码语言:javascript
复制
function linkFormatter(value, row, index) {
  return '<a href="' + value + '" target="_blank">' + value + '</a>';
}
  1. 初始化bootgrid并加载数据。在初始化过程中,使用data-formatter属性将自定义的列格式化函数应用到链接列。例如:
代码语言:javascript
复制
$(document).ready(function() {
  $('#myGrid').bootgrid({
    ajax: true,
    url: 'data.php', // 替换为获取数据的URL
    formatters: {
      'link': linkFormatter
    }
  });
});

以上代码假设你有一个名为data.php的服务器端脚本来提供表格数据。你需要根据实际情况修改URL和数据获取方式。

这样,bootgrid表格中的链接列就会以可点击的形式显示,并在新选项卡中打开链接。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Bootstrap学习------Tabel

Bootstrap的表格和Html表格大同小异,只是封装了一些css供我们使用

标签必须引用class="table"基类样式,我们可以根据需求赛选需要的样式其中主要的几个样式 (1) table-hover 鼠标悬停在当前行时有特效 (2) table-striped 表格呈现斑马线效果 (3) table-bordered 表格显示边框 (4) table-condensed 紧凑型表格 <!DOCTYPE html> <html> <head> <title>

05
 之内的每一行增加斑马条纹样式。

03
领券