テーブルの列をn番目の区切り文字で新しい列に分割する方法

Question

スラッシュ区切り文字で3番目の列を新しい列に分割するコードを作成することができました。

私がしなかったことは、n番目（つまり2番目）のオカレンスで分割されることでした。 私はインターネット上で同様の質問を見つけることができなかったので、私はここに投稿します。

次のように所望の成果は次のようになります。

すべてのヘルプは大歓迎です！

\t function split() { 
 
\t  var delimiter = "/"; 
 
\t  var arr = []; 
 
\t  var highest = 0; 
 
\t  var columnIndex = ""; 
 
\t  $('#tbl td:nth-child(3)').each(function() { 
 
\t   ColumnIndex = $(this).index(); 
 
\t   var string = $(this).text(); 
 
\t   var array = string.split(delimiter); 
 
\t   var nbrCharacter = (string.split(delimiter).length - 1) //COUNT OCCURENCES OF CHARACTER 
 
\t   var temp = (nbrCharacter > highest) ? highest++ : highest = highest; 
 
\t   arr.push(string.split(delimiter)); 
 
\t  }); 
 
\t  for (i = 0; i < highest; i++) { //ADD EMPTY COLUMNS 
 
\t   $('#tbl').find('tr').each(function() { 
 
\t    $(this).find('td').eq(ColumnIndex).after('<td></td>'); 
 
\t   }); 
 
\t  } 
 
\t  for (i = 0; i < arr.length; i++) { //POPULATE CELLS FROM ARRAY 
 
\t   var columnTracker = ColumnIndex 
 
\t   for (j = 0; j < arr[i].length; j++) { 
 
\t    $('#tbl').find('tr:eq(' + (i + 1) + ')').find('td:eq(' + columnTracker + ')').html(arr[i][j]); 
 
\t    columnTracker++ 
 
\t   } 
 
\t  } 
 
\t }

th { 
 
    height: 15px; 
 
    min-width: 30px; 
 
    border: 1px solid black; 
 
    font-size: 12px; 
 
    font-family: Courier, monospace; 
 
    padding: 2px 5px 2px 5px; 
 
} 
 

 
td { 
 
    height: 15px; 
 
    min-width: 30px; 
 
    border: 1px solid black; 
 
    font-size: 12px; 
 
    font-family: Courier, monospace; 
 
    padding: 2px 5px 2px 5px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button type="button" onclick="split()">Split</button> 
 

 
<br> 
 
<br> 
 
<table id="tbl"> 
 
    <thead> 
 
     <tr class="tbl-header"> 
 
      <th>1</th> 
 
      <th>2</th> 
 
      <th>3</th> 
 
      <th>4</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr> 
 
      <td>A/B/C</td> 
 
      <td>B/C</td> 
 
      <td>C</td> 
 
      <td></td> 
 
     </tr> 
 
     <tr> 
 
      <td>A/B</td> 
 
      <td>B/C</td> 
 
      <td></td> 
 
      <td>D/E</td> 
 
     </tr> 
 
     <tr> 
 
      <td></td> 
 
      <td></td> 
 
      <td></td> 
 
      <td></td> 
 
     </tr> 
 
     <tr> 
 
      <td>A/B/C/D</td> 
 
      <td></td> 
 
      <td>C/D/E</td> 
 
      <td>D/E/F</td> 
 
     </tr> 
 
     <tr> 
 
      <td></td> 
 
      <td>B/C/D</td> 
 
      <td>C/D</td> 
 
      <td>D/E/F/G</td> 
 
     </tr> 
 
     <tr> 
 
      <td>A/B/C</td> 
 
      <td>B/C/D/E</td> 
 
      <td>C/D/E/F</td> 
 
      <td></td> 
 
     </tr> 
 
    </tbody> 
 
</table>

Answer 1

あなたは第二のスラッシュからセルデータを分割するために、このロジックを使用することができます。

 var string = "A/B/C/D/E/F"; //use $(this).text(); here 
 
\t \t var delimiter = "/"; // remove this line to use your delimiter variable 
 
    var indexOfSecond = string.indexOf(delimiter, string.indexOf(delimiter)+1); 
 
\t \t console.log(indexOfSecond); 
 
    if(indexOfSecond > -1){ 
 
     var fOne = string.substring(0,indexOfSecond); 
 
     var sOne = string.substring(indexOfSecond+1); 
 
     console.log(fOne); 
 
     console.log(sOne); 
 
    }