Tablo hücre değerinde değişiklik olduğunda ne olacağını belirleyin

Aşağıdaki gibi bir tablom var. Ne zaman fpTotal ve frTotal id ile hücrenin değerinde bir değişiklik olduğunda nasıl belirlenir. JQuery değişim olayını denedim ama egzersiz yapmadı. Uygun JS işlevi hangisidir? Tablo hücre değerinde değişiklik olduğunda ne olacağını belirleyin

<table class="table table-bordered table-hover table-sm" id="t01"> 
     <thead style="text-align:center"> 
     <tr> 
      <th>Description</th> 
      <th>Rate/Unit</th> 
      <th>Total No</th> 
      <th>Price</th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr> 
      <th>Rate</th> 
      <td id="fpRate" style="text-align:right">0</td> 
      <td id="fpNos" style="text-align:center">0</td> 
      <td> 
       <div style="float:left">$</div> 
       <div style="float:right" id="fpTotal">-</div> 
      </td> 
     </tr> 
     <tr> 
      <th >Fractional page rate</th> 
      <td id="frRate" style="text-align:right">0</td> 
      <td id="frNos" style="text-align:center">0</td> 
      <td> 
       <div style="float:left">$</div> 
       <div id="frTotal" style="float:right">-</div> 
      </td> 
     </tr> 
    </tbody> 
</table>

Olay dinleyicisi ekleyebilir olay

$("#fpTotal").change(function(){ 
    alert("The text has been changed."); 
}); 

$("#frTotal").change(function(){ 
    alert("The text has been changed."); 
});

kaynak

2016-04-12 Sam

metin değişikliği yapar nasıl? Ayrıca, sınıfları kullanmalı ve kimlikleri kullanmamalısınız. – itdoesntwork

Değişiklik olayı yalnızca giriş tipi öğelerinde çalışır. Burada göstermediğiniz şey, o konumlarda değerlerin nasıl değiştiğidir. –

Bu değerleri sunucudan değiştirirseniz, bu öğeyi bir yere kaydetmeniz gerekir ve bundan sonra bunu karşılaştırabilirsiniz. Eğer Div elemanını değiştirmeye çalışırsanız, bu imkansızdır. –

jQuery değişikliği gibi bir şey

altına

var fpRate = document.getElementById('fpRate'); 
 
fpRate.addEventListener('DOMSubtreeModified',function() { 
 
    alert(fpRate.innerHTML); 
 
}); 
 

 

 
var fpNos = document.getElementById('fpNos'); 
 
fpNos.addEventListener('DOMSubtreeModified',function() { 
 
    alert(fpNos.innerHTML); 
 
}); 
 

 

 
function changeCellData(data) { 
 
    fpRate.innerHTML = data; 
 
    fpNos.innerHTML = data; 
 
}

<table class="table table-bordered table-hover table-sm" id="t01"> 
 
     <thead style="text-align:center"> 
 
     <tr> 
 
      <th>Description</th> 
 
      <th>Rate/Unit</th> 
 
      <th>Total No</th> 
 
      <th>Price</th> 
 
     </tr> 
 
     </thead> 
 
     <tbody> 
 
     <tr> 
 
      <th>Rate</th> 
 
      <td id="fpRate" style="text-align:right">0</td> 
 
      <td id="fpNos" style="text-align:center">0</td> 
 
      <td> 
 
       <div style="float:left">$</div> 
 
       <div style="float:right" id="fpTotal">-</div> 
 
      </td> 
 
     </tr> 
 
     <tr> 
 
      <th >Fractional page rate</th> 
 
      <td id="frRate" style="text-align:right">0</td> 
 
      <td id="frNos" style="text-align:center">0</td> 
 
      <td> 
 
       <div style="float:left">$</div> 
 
       <div id="frTotal" style="float:right">-</div> 
 
      </td> 
 
     </tr> 
 
    </tbody> 
 
</table> 
 

 
<button onClick="changeCellData('1')">Set 1</button>

kaynak

2016-04-12 20:30:48 pradeep1991singh

Tablo hücre değerinde değişiklik olduğunda ne olacağını belirleyin

cevap

İlgili konular