关于匹配div和td的任何想法 [英] Any idea on matching div and td

问题描述

这是我的结构

< div> //这代表div的容器为div 
< div> // row 
< div> div header< / div> // data 
< / div> 
< / div> 
 
 
< div> 
< table> 
< tbody> 
< tr> 
< td>数据必须匹配< / td> 
< / tr> 
< / tbody> 
< / table> 
< / div> 

i必须将td宽度与标头匹配或带有do td宽度的标头，原始表td跟随表的相应的th但我不能做的原因示例：固定



不要说使用插件



谢谢大家发布我的

 jsfiddle 

获取完整的HTML



我尝试了什么：



i尝试了非常沉闷的剧本，但这并不好所以

 $（续）.find（'。fixedheaderHolder'）。children（'div'）。each（function（）{
 let height = $（cont）.find（'table thead tr th [data-column-index ='+ $（this）.attr（'data-column-index'）+']'）。outerHeight（ ）; 
 $（续）.find（'table thead tr th [data-column-index ='+ $（this）.attr（'data-column-index'）+']'）。outerWidth（ ）; 
 let width = $（cont）.find（'table thead tr th'）。eq（$（this）.attr（'data-colu） mn-index'））。outerWidth（）; 
 console.log（width）
 console.log（height）
 $（this）.append（$（'< div>< ; / DIV> '）HTML（' &NBSP; '）addClass（' resizeHandler'））; 
 $（this）.css（{
'width'：height +'px'，
'height'：width +'px'
}）
}）; 

解决方案

（续）.find（'。fixedheaderHolder'）。children（'div'）。each（function（）{
let height =

（cont）.find（'table thead tr th [data-column-index ='+

（this ）.attr（ '数据列索引'）+ ']'）outerHeight（）;

Here is my structure

<div>// this represent container of th as div
 <div> // row
  <div>div header</div> //data
 </div>
</div>


<div>
 <table>
  <tbody>
   <tr>
    <td>data has to match</td>
   </tr>
  </tbody>
 </table>
</div>

i has to match td width to header with or header with do td width, original table td follows table's corresponding th but i cant do th for reasons example:fixed

dont say use plugin

thank you i all post my

jsfiddle

for full html

What I have tried:

i tried very dull script like this but its not good so

$(cont).find('.fixedheaderHolder').children('div').each(function(){
          let height = $(cont).find('table thead tr th[data-column-index='+$(this).attr('data-column-index')+']').outerHeight();
          $(cont).find('table thead tr th[data-column-index='+$(this).attr('data-column-index')+']').outerWidth();
          let width = $(cont).find('table thead tr th').eq($(this).attr('data-column-index')).outerWidth();
          console.log(width)
          console.log(height)
          $(this).append($('<div></div>').html(' ').addClass('resizeHandler'));
          $(this).css({
            'width': height+'px',
            'height': width+'px'
          })
        });

解决方案

(cont).find('.fixedheaderHolder').children('div').each(function(){ let height =

(cont).find('table thead tr th[data-column-index='+

(this).attr('data-column-index')+']').outerHeight();

这篇关于关于匹配div和td的任何想法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！