変更時にHTMLテーブルを編集可能

Question

テーブル内の単一の行を変更しようとしています。たとえばV1またはV2となりますが、理論的にV1を変更した場合はT1のみ変更する必要がありますが、これは機能しません。フィールドV1を変更すると、フィールドT1とT2が値を変更します。

\t $('#editable').editableTableWidget(); 
 
\t $('#editable td.uneditable').on('change', function(evt, newValue) { 
 
\t \t return false; 
 
\t }); 
 

 
    $('#editable td').on('change', function(evt, newValue) { 
 
\t if($("#V1").text()){ 
 
\t $("#T1").text(+ $("#A1").text() - + $("#V1").text()); 
 
    } 
 
    });

<table id="editable" class="pure-table pure-table-bordered"> 
 
    <tbody> 
 
    <tr> 
 
    <td>Apples</td> 
 
    <td id="A1">10</td> 
 
    <td id="V1">2</td> 
 
    <td id="T1"></td> 
 
    </tr> 
 

 
    <tr> 
 
    <td>Pear</td> 
 
    <td id="A2">22</td> 
 
    <td id="V2">2</td> 
 
    <td id="T2"></td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 1

T2

はT1が新しいtd幅を持って、それが変更されますが、そのていなかったようitcanが見える場合、それが唯一の新しい幅を適用することができ、その値を変更していません。

Here is a demo