jQuery-表单未提交 [英] Jquery - Form not being submitted

问题描述

我有一些代码，当单击搜索框时，会对位置框中的位置进行地理编码(除非由自动建议用户已完成)，然后应提交表单.

I have some code which, when the search box is clicked, geocodes a location (unless laready done by the autosuggest) in the location box and should the submit the form.

问题是，单击searhc按钮并且地址解析成功后，表单未提交.谁能告诉我我要去哪里错了?

The problem is, the form does not get submitted after the searhc button is clicked and the geocode is successful. Can anyone tell me where I am going wrong?

这是jsfiddle的链接: http://jsfiddle.net/sR4GR/35/

This is a link to the jsfiddle: http://jsfiddle.net/sR4GR/35/

这是完整的代码:

$(function () { 

    var input = $("#loc"),
        lat = $("#lat"),
        lng = $("#lng"),
        lastQuery = null,
        autocomplete;

    function processLocation(query) {
        var query = $.trim(input.val()),
            geocoder;

        if (!query || query == lastQuery) {
            console.log("Empty or same variable");
            return;
        }

        lastQuery = query;

        geocoder = new google.maps.Geocoder();
        geocoder.geocode({
            address: query
        }, function (results, status) {
            if (status === google.maps.GeocoderStatus.OK) {
                lat.val(results[0].geometry.location.lat());
                lng.val(results[0].geometry.location.lng());
            } else {
                alert("We couldn't find this location. Please try an alternative");
            }
        });
    }

    autocomplete = new google.maps.places.Autocomplete(input[0], {
        types: ["geocode"],
        componentRestrictions: {
            country: "uk"
        }
    });

    google.maps.event.addListener(autocomplete, 'place_changed', processLocation);

    $('#searchform').on('submit', function (event) {
        processLocation();
        event.preventDefault();
    });
});

推荐答案

我不知道processLocation(query)对query有什么期望，但是想法是这样的:
1.更改功能签名

I don't know what processLocation(query) expects for query, but idea would be this:
1. change function signature

function processLocation(query, doSubmit) { // <--- new parameter
    var query = $.trim(input.val()),
        geocoder;

    if (!query || query == lastQuery) {
        console.log("Empty or same variable");
        return;
    }

    lastQuery = query;

    geocoder = new google.maps.Geocoder();
    geocoder.geocode({
        address: query
    }, function (results, status) {
        if (status === google.maps.GeocoderStatus.OK) {
            lat.val(results[0].geometry.location.lat());
            lng.val(results[0].geometry.location.lng());
            if (doSubmit){
                 $('#searchform').submit(); //<-- new param usage
            }
        } else {
            alert("We couldn't find this location. Please try an alternative");
        }
    });
}

2.删除此通话

$('#searchform').on('submit', function (event) {
    alert('Submitted')
    event.preventDefault(); 
});

3.添加此通话

$('#search').click(function(){
     processLocation(new Date(), true); //<-- don't know what's the first param
});

试图在您的jsfiddle中玩耍，但没有成功，因为我一直在向控制台发送Empty or same variable消息.我想您会更好地了解自己的逻辑，并且会发现

Tried to play around in your jsfiddle but had no success as I was constantly getting Empty or same variable message into console. I think you know your logic better and you'll figure out

这篇关于jQuery-表单未提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！