前提・実現したいこと
javascriptでソート付きの表を作成しています。
見出しセルをクリックして、セルのインデックスを取得したいのですが、
どのセルをクリックしても同じ数字が出てしまいます。
発生している問題・エラーメッセージ
どのthをクリックしても3
該当のソースコード
js
1 2const tbl_ths =['Name', 'gender','Team', 'Score',]; 3const tbl_dat=[ 4 ['Tokieda','男','red','2'], 5 ['takahashi','男','blue','12'], 6 ['miyahashi','男','blue','31'], 7 ['taguchi','女','Orange','32'], 8]; 9 10class setHead { 11 constructor(els){ 12 const table = document.querySelector('table'); 13 this.thead = document.createElement('thead'); 14 this.tr=document.createElement('tr'); 15 for(let i=0;i<els.length;i++){ 16 this.th=document.createElement('th'); 17 this.th.innerHTML=els[i]; 18 this.th.addEventListener('click',()=>{ 19 20 console.log(this.th.cellIndex) 21 //この部分が問題↑ 22 23 }) 24 this.tr.appendChild(this.th); 25 } 26 this.thead.appendChild(this.tr); 27 table.appendChild(this.thead); 28 } 29} 30 31class setDate { 32 constructor(array){ 33 const table = document.querySelector('table'); 34 this.tbody = document.createElement('tbody'); 35 36 array.forEach(els => { 37 this.tr=document.createElement('tr'); 38 39 for(let i=0;i<els.length;i++){ 40 this.td=document.createElement('td'); 41 this.td.innerHTML=els[i]; 42 this.tr.appendChild(this.td); 43 }; 44 45 this.tbody.appendChild(this.tr); 46 }) 47 table.appendChild(this.tbody); 48 } 49 50} 51 52const header=new setHead(tbl_ths); 53const date = new setDate(tbl_dat);
何故同じ番号しか現れないのか?どのようにしたら取得できるか、教えてください。
回答1件
あなたの回答
tips
プレビュー