在表单提交期间更新隐藏值答案

【问题标题】：Update hidden values during form submit在表单提交期间更新隐藏值
【发布时间】：2021-02-25 09:15:41
【问题描述】：

我正在尝试使用来自 Google 地理编码器的 lat 和 lng 更新 2 个隐藏值。

<input id="userlat" name="userlat" type="hidden">
<input d="userlng" name="userlng" type="hidden">

值更新正常，但未发布数据。不知道我做错了什么，猜测我的顺序不正确？

$(document).ready(function() {
    $('.directory-search.mapping').submit(function(e){
        var postal = $('#loc').val();
        e.preventDefault();
        if(postal) {
            var geocoder = new google.maps.Geocoder();
            geocoder.geocode({ 'address': postal, componentRestrictions: { country: 'UK' }}, function(results, status) {
                var lat = $('.directory-search.mapping').find("input[name=userlat]");
                var lng = $('.directory-search.mapping').find("input[name=userlng]");
                lat.val(results[0].geometry.location.lat());
                lng.val(results[0].geometry.location.lng());
                return true;
            })
        this.submit();
        }
    });
});

【问题讨论】：

geocoder.geocode 可能是一种异步方法，这意味着您在实际检索结果并将其放入隐藏字段之前在此处提交表单。在设置隐藏值之后，从该方法的回调函数中提交表单。
尝试使用promise或async await来帮助你

标签： javascript jquery forms input

【解决方案1】：

我会尝试移动

this.submit()

在 .geocode() 回调函数中，因为该函数是异步的，并且在函数完成之前执行提交。

你只需要照顾“this”，它不会在回调中被识别。

解决这个问题的一个小技巧是在函数之前设置“this”：

var test = this;

然后像这样在回调中调用提交：

test.submit();

【讨论】：