Jak rozpoznat Změna textového pole v jQuery

hlasů
0

Mám dva textové vstupní textové pole a chci udělat celkem bez ohledu žádný zadané uživatelem. Níže je můj kód:

$(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>

Když vstup I 10první pak to znamená 11, pak, pokud zadám 100 pak to trvá 111, já ne dostat, proč se to děje. Kde dělám chybu, veď mě?

Položena 24/10/2019 v 11:52
zdroj uživatelem
V jiných jazycích...                            


5 odpovědí

hlasů
2

Na svém kódu, když zadáte první číslici to bylo počítáno na celkovou následujících důvodů total += parseInt($(this).val()). Například, pokud vaše první číslice je 1, pak v té době celkem aktualizuje as total = 1, na druhém stisknutí tlačítka, například vzít 0, pak se vaše vstupní celkem stane 10. Je výpočtu na aktuální celkovou hodnotou total = total + 10. To je důvod, proč jste získali 11 jako odpověď

Zkuste takhle.

$(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>

Odpovězeno 24/10/2019 v 11:58
zdroj uživatelem

hlasů
0

Použít událost změny namísto vstupní události. To bude platit pouze v případě, je-li hodnota „spáchal“, namísto každé klávesy. Viz MDN podrobnosti.

Odpovězeno 24/10/2019 v 11:59
zdroj uživatelem

hlasů
0

Důvod, proč to nebylo ti ukázal výsledek, který chcete, je to, že výpočet je špatné. Nyní přidejte číslo z celkového počtu, pokaždé, když jednu změnu vstupního pole. Takže pokud napíšete 123, to znamená 0 ​​+ 1, pak 1 + 12, pak 13 + 123, takže budete mít 136 jako výsledek.

Napsal jsem řešení pro váš dotaz. Kód je v níže uvedené housle.

Dalo by se přidat funkci, kde si vypočítat součet všech vstupních polí (může být více než 2, to je druhový).

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

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

Ao změně svých vstupních polí, stačí spustit tuto funkci.

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

Váš příklad je v tomto podfuk: https://jsfiddle.net/xL6hgder/2/

Odpovězeno 24/10/2019 v 12:01
zdroj uživatelem

hlasů
1

Jen aktualizovat celkem s touto vstupní hodnoty, které se snažíte změnit.

Pro získání celkem pro oba vstupní hodnoty musíte mít obě hodnoty a přidejte ji s celkem.

Zkuste pod kódovým

$(document).ready(function() {
  $(".test").on("change", function() {
    var total = 0;
    $('.test').each(function() {
      if (!isNaN(parseInt($(this).val()))) {
        total += parseInt($(this).val());
      }
    });
    // Print entered value in a div box

    $("#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>

Odpovězeno 24/10/2019 v 12:05
zdroj uživatelem

hlasů
0
 $(document).ready(function () {
        $(".test").on('input', function () {
            var total = parseInt($("#result").text());
            total = parseInt($("#myInput").val()) + parseInt($("#myInput1").val());
            $("#result").text(total);
        });
    });

 <p><input type="text" class="test" placeholder="Type something..." id="myInput" /></p>
    <p><input type="text" class="test" placeholder="Type something..." id="myInput1" /></p>
    <div id="result"></div>
Odpovězeno 24/10/2019 v 12:26
zdroj uživatelem

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