Nicht Lesen .val() einige Eingänge

Question

Ich habe die folgende Form:

<div class="col-md-12"> 
    <div class="inLabel go-bottom hvz-street-smaller"> 
     <div class="inLabelDiv"> 
      <input type="text" name="locStreetAddress" id="locStreetAddress" placeholder="Straße" class="hvz-form-control triggerAddress"> 
      <label for="locStreetAddress">Straße</label> 
     </div> 
    </div> 
    <div class="inLabel go-bottom hvz-number-smaller"> 
     <div class="inLabelDiv"> 
      <input type="text" name="locNumber" id="locNumber" placeholder="HNr." class="hvz-form-control triggerAddress"> 
      <label for="locNumber">HNr.</label> 
     </div> 
    </div> 
</div> 
<div class="col-md-12"> 
    <div class="inLabel go-bottom hvz-zip-smaller"> 
     <div class="inLabelDiv"> 
      <input type="text" name="locZip" id="locZip" placeholder="Postleitzahl" class="hvz-form-control triggerPrice triggerAddress" value=""> 
      <label for="locZip">Postleitzahl</label> 
     </div> 
    </div> 
    <div class="inLabel go-bottom hvz-city-smaller"> 
     <div class="inLabelDiv"> 
      <input type="text" name="locCity" id="locCity" placeholder="Stadt" class="hvz-form-control triggerAddress" value=""> 
      <label for="locCity">Stadt</label> 
     </div> 
    </div> 
    <div class="inLabel go-bottom hvz-country-smaller"> 
     <div class="inLabelDiv"> 
      <input type="text" name="locCountry" id="locCountry" placeholder="Land" class="hvz-form-control triggerAddress" value="Deutschland"> 
      <label for="locCountry">Land</label> 
     </div> 
    </div> 
</div> 

Für jeden .triggerAddress Eingang ich dies tun:

$(document).on('change', '.triggerAddress', function (event) { 
    var street = $('#locStreetAddress').val(); 
    var number = $('#locNumber').val(); 
    var zip = $('#locZip').val(); 
    var city = $('#locCity').val(); 
    var country= $('#locCountry').val(); 
    var address = street + ' ' + number + ', ' + zip + ' ' + city + ', ' + country; 
    if(street !== '' && number !== '' && zip !== '' && city !== '' && country !== ''){ 
     //..DO STUFF 
    }else{ 
     console.log(address); 
    } 
}); 

Unfortunatley, var street und var number nie Wert bekommen? Doing console.log(street) oder console.log($('#locStreetAddress').val()) gibt eine Leerzeile für Straße und Nummer zurück. Alle anderen Felder funktionieren wie vorgesehen.

Was fehlt mir?

// EDIT Finale Bearbeiten/Cleanup Es ist ein Problem mit featherlight.js Ich verwende: https://github.com/noelboss/featherlight/issues/122 Für die Zukunft:/Eingänge lesen richtig zu aktualisieren, machen persist: true und alles wie vorgesehen funktioniert.

Answer 1

change-input type="text" wirkt eher wie blur

können Sie input,keypress,keyup,paste

Kontrolle dieses jsfiddle

EDIT

prüfen verwenden diese Linie

if(street !== '' && number !== '' && zip !== '' && city !== '' && country !== '') 

Sie verwenden && also, wenn Schleife ausgeführt wird, wenn keiner von ihnen sind leer, sonst sonst Schleife

prüfen diese zweite jsfiddle