Question

我需要在提交前更新（隐藏）表单字段我尝试了所有可能的实现，但更改后的值根本没有提交 - ＆gt;提交旧值而不是提交我想要更新的字段是'XXX_place' 我将其设置为''首先删除旧值：

$('#XXX_place').val('');

此代码检查是否已更新：

if ($('#XXX_place').val() == '') {
        event.preventDefault();
}

表单未提交，因为条件为真但字段已更新且具有正确的值 - ＆gt;这非常令人困惑

我最近的猜测是它的可变范围 - 所有内容都是在

内完成的

功能（结果，状态）{

未设置为globaly，虽然我的字段已更新，但结果未提交。我应该改变什么？

这里是完整的代码：

    var geocoder;
var placeData;
geocoder = new google.maps.Geocoder();

var input = document.getElementById('XXX_address'),
        options = {
            types: ['geocode'],
            language: ['de'],
            componentRestrictions: {country: 'de'}
        },
        autocomplete = new google.maps.places.Autocomplete(input, options);

$('#searchform').submit(function(event) {
    codeAddress();
    if ($('#XXX_place').val() == '') {
        event.preventDefault();
    }
});


function codeAddress() {
    $('#XXX_place').val('');
    placeData = '';
    var bounds = new google.maps.LatLngBounds(new google.maps.LatLng(48.257141, 11.335030),
        new google.maps.LatLng(48.014731, 11.828041));
    geocoder.geocode( { 'componentRestrictions':{'locality': 'Munich'},
        'bounds': bounds, 'address': $('#XXX_address').val()}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            placeData = stringifyPlace(results[0].formatted_address, results[0].geometry.location);
            $('#XXX_place').val(placeData);
            }
     });

      alert(placeData);
}

function stringifyPlace(address, location) {

    return JSON.stringify({"formatted_address": address,
                                    "latitude": location.d,
                                    "longitude": location.e
                                    });
}

Answer 1

JavaScript并不像您可能知道的大多数脚本语言一样。它在很大程度上取决于回调函数（处理程序），以避免像这样运行问题。

在提交时，您正在调用codeAdress（），您可以在其中调用地理编码方法。该方法似乎使用ajax调用。 JavaScript并不关心该调用是否已完成，只是继续提交。

您可以通过将单击事件处理程序绑定到提交按钮而不是侦听提交来解决此问题。您必须在地理编码器回调函数中阻止默认和触发提交，如下所示：

$('#id_of_submit_button').click(function(e){
 e.preventDefault();
 codeAdress();

 return false;
});

和

geocoder.geocode( { 'componentRestrictions':{'locality': 'Munich'},
                    'bounds': bounds, 'address': $('#XXX_address').val()}, 
                    function(results, status) {
                      if (status == google.maps.GeocoderStatus.OK) {
                        placeData = stringifyPlace(results[0].formatted_address,
                        results[0].geometry.location);
                        $('#XXX_place').val(placeData);
                        $('#searchform').submit();
                      }
                     });

另一种可能性是使用布尔变量处理你的提交。

var val_unchanged = false;

// some code

$('#searchform').submit(function(e){
  if val_unchanged{
    e.preventDefault
    codeAdress();
    return false;
  }else{
    return true;
  }
});

// add at the end of geocode callback
val_unchanged = false;
$('#searchform').submit();

最好不要依赖表单并手动提交数据。

表单提交失败之前的jQuery字段更新 - javascript变量范围

1 个答案: