onclickを使用してセルの変数にテキストコンテンツを取得する方法

Question

これは私が持っているものの例です。行がチェックされていれば、情報を取得します。情報には、名前はこれがチェックするためにJavaScriptを使用して、私のHTMLプロジェクトの一部であると強調した行の最初の列

window.onload = highlight(); 
 

 
function highlight(){ 
 
\t var table = document.getElementById('myTab1'); 
 
\t \t for (var i=0;i < table.rows.length;i++){ 
 
\t \t \t table.rows[i].onclick = function() { 
 
\t \t \t \t var flag = false; 
 
\t \t \t \t if(this.className == 'check-tr'){ 
 
\t \t \t \t \t this.className = 'check-tr-checked'; 
 
\t \t \t \t \t flag = true; 
 
\t \t \t \t } 
 
\t \t \t \t if(this.className == 'check-tr-checked' && flag == false){ 
 
\t \t \t \t \t this.className = 'check-tr'; 
 
\t \t \t \t } \t \t 
 
\t \t \t } 
 
\t } 
 
}

.check-td{ 
 
\t background-color: #FFFFFF; 
 
\t padding: 8px; 
 
\t border: 1px solid; 
 
\t min-width:100px; 
 
} 
 

 
.check-tr .check-td{ 
 
\t background-color: #ffffff; 
 
\t padding: 8px; 
 
\t border: 1px solid; 
 
\t min-width:100px; 
 
} 
 

 
.check-tr:hover .check-td{ 
 
\t background: #ddd; \t 
 
} 
 

 
.check-tr-checked .check-td{ 
 
\t background-color: #ababad; 
 
\t padding: 8px; 
 
\t border: 1px solid; 
 
\t min-width:100px; 
 
} 
 

 
.check-tr-checked:hover .check-td{ 
 
\t background: #ddd; 
 
}

<table id="myTab1" style="width:90%"> 
 
\t \t <thead> 
 
\t \t \t <td class="report-th" colspan="2"> 
 
\t \t \t \t Reports 
 
\t \t \t </td> 
 
\t \t </thead> 
 
\t \t 
 
\t \t <tbody> 
 
\t \t \t \t <tr class="check-tr"> 
 
\t \t \t \t \t \t <td class="check-td"> 
 
\t \t \t \t \t \t \t \t a 
 
\t \t \t \t \t \t </td> 
 
      <td class="check-td"> 
 
       1 
 
      </td> 
 
     </tr> 
 
     <tr class="check-tr"> 
 
\t \t \t \t \t \t <td class="check-td"> 
 
\t \t \t \t \t \t \t \t b 
 
\t \t \t \t \t \t </td> 
 
      <td class="check-td"> 
 
       2 
 
      </td> 
 
     </tr> 
 
     <tr class="check-tr"> 
 
\t \t \t \t \t \t <td class="check-td"> 
 
\t \t \t \t \t \t \t \t c 
 
\t \t \t \t \t \t </td> 
 
      <td class="check-td"> 
 
       3 
 
      </td> 
 
     </tr> 
 
     <tr class="check-tr"> 
 
\t \t \t \t \t \t <td class="check-td"> 
 
\t \t \t \t \t \t \t \t d 
 
\t \t \t \t \t \t </td> 
 
      <td class="check-td"> 
 
       4 
 
      </td> 
 
     </tr> 
 
    </tbody> 
 
</table>

内のテキストと同じであるブール変数として保存しなければなりませんテーブル内の行のチェックを外して（クラスを変更する）

window.onload = highlight(); 

function highlight{ 
    var table = document.getElementById('myTab1'); 
     for (var i=0;i < table.rows.length;i++){ 
      table.rows[i].onclick = function() { 
       alert(this.content); 
       var flag = false; 
       if(this.className == 'check-tr'){ 
        this.className = 'check-tr-checked'; 
        flag = true; 
       } 
       if(this.className == 'check-tr-checked' && flag == false){ 
        this.className = 'check-tr'; 
       }  
      } 
     } 
} 

クリックした行から最初のセルのテキストを変数に保存します。誰かが私を助けることができますか？

Answer 1

window.onload = highlight(); 

function highlight(){ //added paranthesis here 
    var table = document.getElementById('myTab1'); 
     for (var i=0;i < table.rows.length;i++){ 
      table.rows[i].onclick = function() { 
       alert(this.innerText); 
       var flag = false; 
       if(this.className == 'check-tr'){ 
        this.className = 'check-tr-checked'; 
        flag = true; 
       } 
       if(this.className == 'check-tr-checked' && flag == false){ 
        this.className = 'check-tr'; 
       }  
      } 
     } 
}