Question

我有以下表格：

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

对于每个.triggerAddress输入，我执行此操作：

$(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和var number永远不会有任何价值？执行console.log(street)或console.log($('#locStreetAddress').val())会返回街道和号码的空白行。所有其他字段都按预期工作。

我错过了什么？

// EDIT 最终编辑/清理我正在使用的featherlight.js是一个问题：https://github.com/noelboss/featherlight/issues/122 供将来参考：要正确更新/读取输入，请设置persist: true，一切正常。

Answer 1

change至input type="text"的行为更像blur

您可以使用input,keypress,keyup,paste

检查此jsfiddle

修改

检查此行

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

你正在使用&&所以如果循环将在没有一个为空时执行，否则循环

检查第二个jsfiddle

不读取某些输入的.val（）

1 个答案: