jQuery bir Metin Giriş Kutusuna Değiştir Algılama nasıl

oy
0

İki metin girişi metin kutusu var ve kullanıcı tarafından girilen her ne hayır toplamını yapmak istiyorum. Aşağıda benim kodudur:

$(document).ready(function(){
    var total = 0;
    $(.test).on(input, function(){
        // Print entered value in a div box
        total += parseInt($(this).val());
        $(#result).text(	total);
    });
});
<script src=https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js></script>
<p><input type=text class=test placeholder=Type something... id=myInput></p>
    <p><input type=text class=test placeholder=Type something... id=myInput></p>
    <div id=result></div>

Ben giriş yaparken 10ilk o zaman alır 11, sonra onu alır sonra 100 girerseniz 111bu neden oluyor hiçbir alıyorum. Ben bir hata yapıyorum yerlerde, bana yol?

Oluştur 24/10/2019 saat 12:52
kaynak kullanıcı
Diğer dillerde...                            


3 cevaplar

oy
2

İlk haneyi girerken kod üzerinde nedeniyle toplam hesaplanmış oldu total += parseInt($(this).val()). İlk basamak o zaman, toplam olarak güncellemektedir daha sonra 1 ise, örneğin, total = 1ikinci bir tuş ile, örneğin, daha sonra, giriş toplam o kadar mevcut toplam değere hesaplarken 10. olur, 0 alır total = total + 10. Eğer cevap olarak 11 alıyorsanız bu yüzden

Böyle deneyin.

$(document).ready(function(){
    var total = 0;
    $(".test").on("input", function(){
        // Print entered value in a div box
        if ($("#myInput1").val() && $("#myInput2").val()) {
           total = parseInt(parseInt($("#myInput1").val()) + parseInt($("#myInput2").val()));
           $("#result").text(total);
        }
    });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p><input type="text" class="test" placeholder="Type something..." id="myInput1"></p>
<p><input type="text" class="test" placeholder="Type something..." id="myInput2"></p>
<div id="result"></div>

Cevap 24/10/2019 saat 12:58
kaynak kullanıcı

oy
0

hesaplama yanlıştır çünkü size istediğiniz sonucu gösterdi vermemesinin sebebi vardır. Artık, toplam her zaman bir giriş alanı değişiklikleri numarası ekleyin. Yani 123 yazarsanız, o 13 + 123 yani sonuç olarak 136 olacak, sonra 1 + 12, sonra 0 + 1 sürer.

Ben senin soru için olası bir çözüm yazdı. Aşağıdaki kod keman içindedir.

Eğer tüm giriş alanlarının toplamı hesaplamak bir işlev ekleyebilir (2 den fazla olabilir, bu bildik!).

function calculateTotal(){
  var total = 0;
    $( ".test" ).each(function( index ) {
      var value = $(this).val();
      if(value == ""){
        return;
      }
      total += parseInt(value);

    });
  $("#result").text(    total);
}

Ve giriş alanlarının değişikliği, sadece o işlevi gerçekleştirmek.

$(document).ready(function(){
    var total = 0;
    $(".test").on("input", function(){
        calculateTotal();
    });
});

Sizin örnek bu keman içindedir: https://jsfiddle.net/xL6hgder/2/

Cevap 24/10/2019 saat 13:01
kaynak kullanıcı

oy
0

Değişim etkinliğini yerine girdi olayı kullanın. Değeri yerine her tuş vuruşu, "kararlı" olduğunda sadece patlayacaktır. Bkz MDN detayları için.

Cevap 24/10/2019 saat 12:59
kaynak kullanıcı

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more