Question

我在我的网页中使用bootstrap table，并希望在启用分页时从所有表格单元格中获取完整的文本数据。我尝试了以下方法，它返回所有数据：

var data = $('#' + tableID).bootstrapTable('getData')

现在，当我遍历data对象以获取每个单元格的值时，它可以正常工作，但对于那些具有嵌套html的单元格，例如：

   <td class="danger">cell 4</td>
   <td>
   <a href="https://www.google.com">google</a>
   </td>

现在，在这种情况下，我希望第二个单元格的值为谷歌，但它会将整个html返回为

 <a href="https://www.google.com">google</a>

任何想法，我怎么才能获得文本价值。

我无法进行任何服务器端操作，我必须使用javascript / jquery来实现这一点。我也尝试过使用jquery：

function getColData(tableID,colIndex) {
    var colArray = $('#' + tableID + ' td:nth-child'+'('+colIndex+')').map(function(){
           return $(this).text();
       }).get();
       return colArray
    }

它正确地返回数据，但只有在活动页面上可见，我想要所有数据。

Answer 1

根据你在JSFiddle上的文件，我修改了JS部分如下，这将获得每个td（即文本或文本内容）的文本，而不是它们的属性值。基本上，这遍历了DOM搜索嵌入在其中的标签 - 除了表头上的标签 - 然后获取文本值。

var table = $('#table'), button = $('#button');
button.click(function() {
  var data = [];
  table.find('tr:not(:first)').each(function(i, row) {
    var cols = [];
    $(this).find('td').each(function(i, col) {
      cols.push($(this).text());
    });
    data.push(cols);
  });
  alert(data);
});

您可以在行动here

中看到它

<强>更新这将为您提供所有数据，无论分页如何，它也将剥离标签和嵌套标签。

var table = $('#table'), button = $('#button');

button.click(function() {
  var messedData = table.bootstrapTable('getData');
  var data = [];
  $.each(messedData, function(i, row) {
    var rowData = {
      'name': row['0'],
      'star': row['1'],
      'forks': row['2'],
      'desc': row['3'],
    }

    for (prop in rowData) {
      var tmp = document.createElement("div");
      tmp.innerHTML = rowData[prop];
      rowData[prop] = tmp.textContent || tmp.innerText || "";
    }

    data.push(rowData);
  });
  console.log(data);
});

你可以看到它here

Answer 2

由于实际数据是以字符串形式出现的，我不认为bootstrap-table无法将其与其他数据区分开来。我能想到的简单解决方案是使用substring()从包含自定义html的单元格中提取数据。

http://jsfiddle.net/vwg5Lefz/

另一种方法是浏览生成的表<td>并使用text()从单元格中获取文本数据。

http://jsfiddle.net/n0djy60v/

如何在打开分页时从（html）引导程序表中获取完整数据

2 个答案: