multiplizieren Tabelle td Wert

Question

Ich habe Tabelle mit Menge Zelle als editierbar, wenn die Menge ändern muss es mit anderen Eltern td value.Here ist mein Code
(ie) wenn ich Menge auf 2 dann müssen die Eltern Zeilen multiplizieren durch 2

$(document).ready(function(){ 
 
    $('.quantity').on('change, keyup',function(){ 
 
\t \t var tbvalue=$(this).parents('td').val(); 
 
    console.log(tbvalue); 
 
    var val=$(this).val(); 
 
    var result=tbvalue*val; 
 
    console.log(result); 
 
    }); 
 
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<div class="container"> 
 
    <h2>Table calculation</h2> 
 
    <p>Calculaton</p>    
 
    <table class="table table-hover"> 
 
    <thead> 
 
     <tr> 
 
     <th>value1</th> 
 
     <th>value2</th> 
 
     <th>value3</th> 
 
     <th>Quantity</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr> 
 
     <td>10</td> 
 
     <td>5</td> 
 
     <td>4</td> 
 
     <td class="quantity" type="number" contenteditable>1</td> 
 
     </tr> 
 
     <tr> 
 
     <td>8</td> 
 
     <td type>2</td> 
 
     <td>3</td> 
 
     <td class="quantity" type="number" contenteditable>1</td> 
 
     </tr> 
 
     <tr> 
 
     <td>20</td> 
 
     <td>3</td> 
 
     <td>5</td> 
 
     <td class="quantity" type="number" contenteditable>1</td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
</div>

Answer 1

this.Get den Text von jedem td Versuchen dieses $(this).text(); Verwendung und multiplizieren das mit Eingangswert

$(document).ready(function(){ 
 
    $('.quantity').on('change, keyup',function(){ 
 
     var val=$(this).text(); 
 
if(val =='' || isNaN(val) || val < 1){ 
 
return; 
 
} 
 
     $(this).siblings().each(function(){ 
 
      var tbvalue=$(this).text(); 
 
      
 
      var result= parseInt(tbvalue)*parseInt(val); 
 
      
 
      $(this).text(result); 
 
     }) 
 

 

 
    
 
    }); 
 
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<div class="container"> 
 
    <h2>Table calculation</h2> 
 
    <p>Calculaton</p>    
 
    <table class="table table-hover"> 
 
    <thead> 
 
     <tr> 
 
     <th>value1</th> 
 
     <th>value2</th> 
 
     <th>value3</th> 
 
     <th>Quantity</th> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr> 
 
     <td>10</td> 
 
     <td>5</td> 
 
     <td>4</td> 
 
     <td class="quantity" type="number" contenteditable>1</td> 
 
     </tr> 
 
     <tr> 
 
     <td>8</td> 
 
     <td type>2</td> 
 
     <td>3</td> 
 
     <td class="quantity" type="number" contenteditable>1</td> 
 
     </tr> 
 
     <tr> 
 
     <td>20</td> 
 
     <td>3</td> 
 
     <td>5</td> 
 
     <td class="quantity" type="number" contenteditable>1</td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
</div>