Last keyup Ereignis auf löschen nicht abgefeuert jquery

Question

Ich habe ein seltsames Verhalten mit dem "keyup" -Ereignis: Wenn ich ein Eingabefeld mit etwas ausfüllen, dann lösche ich den Wert, die letzte Löschung keyup Ereignis wird nicht erkannt.

Beispielcode:

$('#input').on('keyup',function(){ 
if($(this).val().length > 0){ 
    $('#text').html($(this).val()) 
} 
}); 

Fiddle HERE

Jede Lösung, oder warum dieses seltsame Verhalten?

Answer 1

UPDATE

Nach dem neuen Problem in der fiddle beschriebene Lösung auf jQuery data basieren können:

$(function() { 
 
    $('#input-deposit').on('keyup', function (e) { 
 
    if ($(this).val().length >= 0) { 
 
     $('#text').html($(this).val()) 
 
    } 
 
    }); 
 

 
    // set the default of previousValue 
 
    $('#input-deposit').data('previousValue', 0); 
 

 
    $('#input-deposit').on('keyup', function (e) { 
 
    var t = 2000; 
 

 
    if (!isNaN(this.value) && this.value.length != 0) { 
 
     // get the previous value 
 
     var previousValue = parseFloat($('#input-deposit').data('previousValue')); 
 
     var total = parseFloat($('#input-balance').val()); 
 
     var deposit = parseFloat($(this).val()); 
 
     $('#input-deposit').data('previousValue', deposit); 
 
     // use previousValue 
 
     t = total + previousValue - deposit; 
 
    } else { 
 
     // reset previousValue 
 
     $('#input-deposit').data('previousValue', 0); 
 
    } 
 
    $('#input-balance').val(t.toFixed(2)); 
 
    }); 
 
});

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 

 
<label>Deposit</label> 
 
<input type="text" value="" id="input-deposit"/> 
 
<label>Balance</label> 
 
<input type="text" value="2000" id="input-balance"/> 
 

 
<div id="text"></div>

Das Problem ist:

if($(this).val().length > 0){ 

Dies muss sein:

if($(this).val().length >= 0){ 

Snippet:

$(function() { 
 
    $('#input').on('keyup',function(){ 
 
    if($(this).val().length >= 0){ 
 
     $('#text').html($(this).val()) 
 
    } 
 
    }); 
 
});

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 

 
<input type="text" value="" id="input"/> 
 
<div id="text"></div>

Answer 2

Ändern Sie einfach den Komparator zu >= statt > und es funktioniert.

$('#input').on('keyup',function(){ 
    if($(this).val().length >= 0){ 
     $('#text').html($(this).val()) 
    } 
}); 

Fiddle here