2

我正在尝试使用带有 jQ​​uery 的 javascript 将制表符分隔的字符串转换为 html 表。

在输入字符串中,行由 分隔<br/>,列由分隔tabs

这是我到目前为止所拥有的:

  $(function(){
    $('div.jstable').each(function(){

      var text = $(this).html();
      var rows = text.split(/<br>/i);
      var htmlString = "<table class='display dataTable'>"
      var startTbody = true;
      for(i = 0; i< rows.length; i++){
        // build header section
        if (i == 0){
          htmlString += '<thead>';
        }else {
          if (startTbody){
            htmlString += '<tbody>';
            startTbody = false;
          }
        }
        htmlString += '<tr>';

        var row = rows[i];
        var columns = row.split('\t'); 
        // build columns
        for (j = 0; j < columns.length; j++ ){
          if (i == 0){
            htmlString += '<th>' + columns[j] + '</th>';
          }else {
            htmlString += '<td>' + columns[j] + '</td>';
          }
        }

        htmlString += '</tr>';
        if (i == 0){
          htmlString += '</thead>'
        } else {
          if (i == rows.length - 1){
            htmlString += '</tbody>'
          }
        }
      }
      htmlString += '</table>';
      $(this).html(htmlString);
    })
  });

这是输入文本:

  <div class="jstable" style="float: left">
col1    col2    col3<br />asda  fd  dfs<br />mmmm   ffff    ssss
  </div>

不幸的是,在 IE8/7 中,jquery .html() 函数返回的文本将所有制表符都替换为空格。

IE9 很好,当前版本的 Firefox 和 Chrome 也可以正常工作。

有任何想法吗?

4

2 回答 2

2

您可以将正则表达式传递给split()/\s+/将任何类型的连续空白视为单个分隔符:

>>> "one   two".split(/\s+/)
["one", "two"]

>>> "one\ttwo".split(/\s+/)
["one", "two"]

>>> "one\ntwo".split(/\s+/)
["one", "two"]
于 2012-06-09T08:08:28.067 回答
1

FWIW 我发现如果我用<pre>标签包围输入文本,.html() 函数将按预期返回带有 IE7/8 中的标签的文本。

因此,初始示例源 html 将如下所示:

  <pre class="jstable" style="float: left">
col1    col2    col3<br />asda  fd  dfs<br />mmmm   ffff    ssss
  </pre>
于 2012-06-11T07:55:05.037 回答