JQuery - テーブルをクリックするたびにセル幅が変更されます

Question

テーブルセルの幅に問題があります。私がやろうすべては、width属性で同じセルにその幅を設定し、その後、.width（）関数を使用して、表のセルの幅を取得することです：

$table.find('tr:first td').each(function() { 
    var actualWidth = $(this).width(); 
    $(this).attr("width", actualWidth); 
}); 

それを取得、ことを私がやるたびにいくつかのセルでは幅が異なります（通常は1つ減らし、別のセルを増やします）。

2012年から同様の質問がありました。jQuery width() returning incorrect values on table cells しかし、これはかなり古く、受け入れられた回答は機能していないようです。

フィドル：https://jsfiddle.net/awolf/40pj1b2u/

すべてのヘルプは理解されるであろう。

Answer 1

私はこれをバグと見なします。 私の解釈： 幅を読み取ると、content-widthが取得されます。 これを設定すると、ボックスがレンダリングされ、ボーダーが設定されます（毎回コンテンツから1pxを取ります）。 .attr（）、.prop（）、および.width（）と同じです。

ボックスサイズ、.innerWidth（）および.outerWidth（）をご覧ください。

Answer 2

1つに2つの問題があると思います。すべてが表セル表示に関連しています。読んだとき

1. <table>でborder属性（ボーダー= "1"）の使用は、おそらく幅の値を台無しに。おそらくattr（ 'width'）の値を設定するときと同じです。最も近い実際の値に一致させるには、innerWidth（）を@Adam Pとして推奨できます。

2. テーブルセルの幅は、使用可能なテーブルの幅によって異なります。あなたのjsfiddleサンプルでは、​​テーブルゾーンを拡張すると、セルの幅が増えています。したがって、各セル幅から、グローバルテーブルの幅を計算して適用することができます。

これを参照してくださいhttps://jsfiddle.net/piiantom/72dvm0v4/、JS調整であなたから取られます。 テーブルの境界を変更することができますが、JSはまだ動作します