在我执行了一些 javascript 逻辑之前，如何在 JQuery 中停止我的“GET”？答案

【问题标题】：How do I stop my 'GET' in JQuery until I've performed some javascript logic?在我执行了一些 javascript 逻辑之前，如何在 JQuery 中停止我的“GET”？
【发布时间】：2015-11-04 11:36:49
【问题描述】：

我在 ASP.Net MVC 中有一个如下所示的表单。它带有一个 get ，但在我提交之前我想运行一些 pre get 处理（从谷歌地图获取地理坐标），然后如果坐标返回我将提交给我的控制器。如果没有坐标返回，那么我会显示一些错误消息并且不会点击控制器。

这是我的表格

@using (Html.BeginForm("Search", "Home", FormMethod.Get))
{
    <div class="form-group">
        @Html.TextBoxFor(model => model.SearchQuery, new { @class = "form-control"})
        @Html.ValidationMessageFor(model => model.SearchQuery, "", new { @class = "text-danger" })

        @Html.TextBoxFor(model => model.ClassDate, "{0:MM/dd/yyyy}", new { @class = "datefield form-control" })
        @Html.ValidationMessageFor(model => model.ClassDate, "", new { @class = "text-danger" })
    </div>
    <button type="submit" id="submitSearch" class="btn btn-default">Search</button>
}

这是我的 javascript 事件，它将获取地址并将其提交到谷歌地图。我尝试在开头添加一个 event.preventDefault 以阻止它调用表单“GET”，但这没有用。

$("#submitSearch").click(function (event) {
        event.preventDefault();
        var geocoder = new google.maps.Geocoder();
        var address = document.getElementById('SearchQuery').value;
        geocoder.geocode({ 'address': address }, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location
                });
                if (results[0].formatted_address) {
                    region = results[0].formatted_address + '<br/>';
                }
                var infowindow = new google.maps.InfoWindow({
                    content: 'Location info:<br/>Country Name:' + region +
                    '<br/>LatLng:' + results[0].geometry.location + ''
                });
                google.maps.event.addListener(marker, 'click', function () {
                    // Calling the open method of the infoWindow 
                    infowindow.open(map, marker);
                });

            }
            else {
                alert("Geocode was not successful for the following reason: " + status);
            }
        });
    });

我应该从我的页面中删除表单并使用 JQuery 和 Ajax 调用它吗？

【问题讨论】：

标签： javascript jquery ajax asp.net-mvc forms

【解决方案1】：

如果您试图停止表单提交，则将事件绑定到表单提交而不是提交按钮单击

$('form').submit(function(e){
    e.preventDefault();
    //your code;
    this.submit();
})

https://jsfiddle.net/bxdao6Lw/1/

【讨论】：

为什么这比按钮点击事件更好？
他还想提交，只是想等“直到”他运行一些其他功能
然后他可以把提交处理程序放在函数的底部
好吧，不使用提交处理程序并在点击事件中使用 event.preventDefault() 怎么样，当我执行我的逻辑然后我调用 $("form").submit() ？与提交按钮单击事件相比，应该使用绑定到提交是否有任何重要原因？
事实上，我认为使用表单提交处理程序是一件坏事，因为现在您处于无限循环中。提交正在调用提交！

【解决方案2】：

不要立即提交表单，而是让 onclick 事件打开一个模式对话框，也可以在此事件中运行脚本。

如果没有返回坐标，则在模式中显示一条消息，否则显示带有提交按钮的表单。

【讨论】：

我正在做一些非常相似的事情，只是没有模态。当点击提交按钮时，我会将按钮变灰并运行搜索。如果未找到任何内容，我将在搜索查询文本框下方或旁边显示错误消息或验证消息。