jQuery:在提交表单之前执行一些操作

2023-12-04

我有一个页面,上面有一个表单。该表单包含一个文本框和一个提交按钮。

提交表单时,通过单击按钮或在文本框中按 Enter 键,我想要进行查找(在本例中,使用 Bing 地图对邮政编码进行地理编码),然后像往常一样将表单提交到服务器。

我当前的方法是将提交事件的处理程序添加到唯一的表单中,然后在完成后调用submit(),但我无法让它工作,并且无法调试问题:

$(document).ready(function () {
    $("form").submit(function (event) {
        var postcode = $.trim($("#Postcode").val());
        if (postcode.length === 0) {
            return false;
        }

        var baseUrl = "http://dev.virtualearth.net/REST/v1/Locations/UK/";
        var apiKey = "myKey";
        var url = baseUrl + postcode + "?key=" + apiKey + "&jsonp=?";
        $.getJSON(url, function (result) {
            if (result.resourceSets[0].estimatedTotal > 0) {
                var location = result.resourceSets[0].resources[0].point.coordinates;
                $("#latitude").val(location[0]);
                $("#longitude").val(location[1]);
                $("form").submit();
            }
        });
    });
});

event.preventDefault()是你的朋友吗?您基本上遇到了同样的问题here。在实际的 ajax 请求完成之前提交表单。您需要停止表单提交,然后进行ajax,然后进行表单提交。如果您不在那里停留,它只会运行它,它唯一有时间做的就是提交表单。

 $(document).ready(function () {
        $("form").submit(function (event) {

// prevent default form submit
    event.preventDefault();
            var postcode = $.trim($("#Postcode").val());
            if (postcode.length === 0) {
                return false;
            }


            var baseUrl = "http://dev.virtualearth.net/REST/v1/Locations/UK/";
            var apiKey = "myKey";
            var url = baseUrl + postcode + "?key=" + apiKey + "&jsonp=?";
            $.getJSON(url, function (result) {
                if (result.resourceSets[0].estimatedTotal > 0) {
                    var location = result.resourceSets[0].resources[0].point.coordinates;
                    $("#latitude").val(location[0]);
                    $("#longitude").val(location[1]);
                    $("form").submit();
                }
            });
        });
    });

然而,当你把preventDefault在那里你不能继续提交表单$('form').submit();不再了。您需要将其作为 ajax 请求发送,或者定义一个条件preventDefault.

也许是这样的:

$(document).ready(function () {

    var submitForReal = false;
        $("form").submit(function (event) {

            var postcode = $.trim($("#Postcode").val());
            if (postcode.length === 0) {
                return false;
            }
    // prevent default form submit
    if(!submitForReal){
    event.preventDefault();
    }else{



            var baseUrl = "http://dev.virtualearth.net/REST/v1/Locations/UK/";
            var apiKey = "myKey";
            var url = baseUrl + postcode + "?key=" + apiKey + "&jsonp=?";
            $.getJSON(url, function (result) {
                if (result.resourceSets[0].estimatedTotal > 0) {
                    var location = result.resourceSets[0].resources[0].point.coordinates;
                    $("#latitude").val(location[0]);
                    $("#longitude").val(location[1]);
                    submitForReal = true;
                    $("form").submit();
                }
            });
          }
        });
    });
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jQuery:在提交表单之前执行一些操作 的相关文章

  • 在自动完成上添加 jQuery 延迟

    我正在尝试为应用程序创建 jQuery 自动完成 search input on keyup function search this val autocomplete div autocomplete get ajax search se
  • 使用 jQuery 保留切换状态[重复]

    这个问题在这里已经有答案了 可能的重复 带 Cookie 的 jQuery 切换 https stackoverflow com questions 2523189 jquery toggle with cookie 我有一个简单的切换 但
  • 如何在 jQuery 中将标题转换为 URL slug?

    我正在 CodeIgniter 中开发一个应用程序 我试图在表单上创建一个字段来动态生成URL slug 我想做的是删除标点符号 将其转换为小写 然后用连字符替换空格 例如 Shane s Rib Shack 将变成 shanes rib
  • 从对象中取出具有无效(NaN、空白等)值的键的最佳方法?

    我有一个供用户填写的简短搜索表单 将有多个搜索查询进入 MongoDB 该表单创建一个名为的变量searchParams可能看起来像这样 var searchParams city Springfield bedrooms 3 bathro
  • 如何设置必须输入特定数字的字段?

    我想知道如何创建一个需要输入特定数字或文本的字段 例如 激活码 以及在输入的确认答案的情况下移动到 网页 并且在未确认的情况下移动到 另一页面 的按钮 使用必需的属性
  • Node.js Express 4.0 中的 res.render 回调参数的用途是什么?

    目的是什么res render回调参数 在什么情况下 由于模板已被指定为第一个参数 因此人们会想要使用这样的回调参数 这是文档中的代码 send the rendered view to the client res render inde
  • 在 jQuery 中获取 SELECT 的值和文本[重复]

    这个问题在这里已经有答案了 可能的重复 获取选择框中选定选项标签的值 https stackoverflow com questions 7380604 getting the value of the selected option ta
  • fadeOut() 和slideUp() 同时进行?

    我已经发现jQuery 淡出然后滑动 https stackoverflow com questions 734554 jquery fadeout then slideup这很好 但不是那个 我怎么能够fadeOut and slideU
  • 如何在 JavaScript 中将变量的内容写入文件[重复]

    这个问题在这里已经有答案了 可能的重复 firefox 如何启用本地 JavaScript 来读取 写入我的 PC 上的文件 https stackoverflow com questions 2846045 firefox how to
  • 转义 \u200b(零宽度空格)和其他非法 JavaScript 字符

    我有一组 JavaScript 对象 我引导到后端模板 以在页面加载时初始化我的 Backbone js 集合 它看起来像这样 作为 Twig 模板 我遇到的问题是某些文本字段包含 u200b 零宽度空格 这会破坏
  • 如何调试超时等待异步 Angular 任务?无法在角度页面上找到元素

    编辑 请注意 在 ernst zwingli 的帮助下 我找到了问题的根源 因此 如果您遇到相同的错误 他指出的修复之一可能会帮助您 我的问题是量角器本身的一个已知问题 如果您认为这可能是您 我已经扩展了我的步骤 以在我最初的问题之后查明问
  • 如何在新窗口中打开图像或pdf文件?

    我有一个 gridview 它包含文件名和文件路径 图像和 pdf 格式文件 其中我使用了模板字段 在该字段下放置了 1 个图像按钮 单击该图像按钮 即 查看 按钮 时 我想在新窗口中打开所选文件 这是我的代码 protected void
  • 选择 asp.net CheckBoxList 中的所有项目

    ASP NET 和 C 我想要一个带有 全选 项目的复选框列表 当这个特定项目是 已选择 所有其他都将被选择 也 当选择被删除时 这个项目 也将来自所有人 其他物品 选中 取消选中 任何其他项目只会有一个 对特定项目的影响 无论选择状态如何
  • 使 Bootstrap Popover 在悬停而不是单击时出现/消失

    我正在使用 Bootstrap 构建一个网站Popover http twitter github com bootstrap javascript html popovers我不知道如何使弹出窗口出现在悬停而不是单击时 我想做的就是当有人
  • 使用jquery调用AS3外部接口

    我正在使用ExternalInterface 调用嵌入在html 页面中的Flash 应用程序 以下代码工作正常 我正在使用按钮进行测试 document ready function button click function var a
  • 选择单选按钮时隐藏/显示 3 个文本框

    我有 2 个单选按钮 选择一个文本框时 我想显示 3 个文本框 并在选择其他文本框时隐藏它 这是代码 这是我的 2 个单选按钮
  • 如何从除自身之外的其他(blazor)库引用js/css文件?

    我如何引用 使用位于引用的 blazor 项目中的 css cs 文件 该文件与 host cshtml 中的当前项目不同 我的意思是
  • 绘制多边形

    我正在使用 Google Maps API V3 根据路径绘制多边形 该路径是随机未排序坐标点 LatLng 的数组 这会产生以下形状 Polylines intersect Problem 由于多边形的形状取决于路径中点的顺序 因此如何对
  • 如何使用 javascript 更改文件扩展名

    有谁知道在 Javascript 中更改文件扩展名的简单方法吗 例如 我有一个带有 first docx 的变量 但我需要将其更改为 first html 这将改变字符串包含文件名 let file first docx file file
  • 如何为 jQuery 插件设置私有变量?

    我想创建一个简单的插件 它使用元素的文本作为默认值 或者您可以在调用插件时设置此值 但是 如果我不设置该值 并为多个元素调用插件 则默认值会成倍增加 function fn reText function options var setti

随机推荐

  • Angular 4 路由器在 routerLink 导航上附加组件而不是销毁它们

    当从子模块内从子路由导航到另一个同级子路由时 路由器不会销毁前一个组件 而是在向前和向后导航时附加新组件 为什么会发生这种情况 开始于 subscriber lookup 搬到 subscriber register route a Sub
  • 如何在 R 中抓取 JSP 页面?

    我想在 R 中抓取以下页面的内容 http directoriosancionados funcionpublica gob mx SanFicTec jsp Ficha Tecnica SancionadosN htm 但是 我无法找到任
  • 如何开发和测试一个发送电子邮件的应用程序(无需用测试数据填充某人的邮箱)? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心以获得指导 我有很多发送电子邮件的应用
  • 有没有类似 python 的交互式 REPL 模式,但适用于 Java?

    有没有类似 python 的交互式 REPL 模式 但适用于 Java 例如 这样我就可以输入InetAddress getAllByName localHostName 在一个窗口中 并立即得到结果 而不需要所有这些 public sta
  • 使用 php 客户端使用 Web 服务(Soap)

    我正在尝试为此编写一个客户端网络服务 它使用两层身份验证 一层位于请求标头中 一层用于服务器中的数据访问 这意味着我需要在标头中传递它 这就是我试图做的 class ChannelAdvisorAuth public DeveloperKe
  • 从Python中的单元素字典中提取键名

    如果我知道我的字典总是有一个元素 有没有办法在不通过列表的情况下提取键名称 我目前正在这样做 data foo 1 2 3 key name data keys 0 有没有更有效的技术 迭代字典产生键 Using next iter gt
  • 插件未加载

    这让我抓狂 我检查并重写了很多次代码 仍然不起作用 这里是 http codepen io cwf pen zGBmgm 虽然tablesorter js已加载 tablesorter is undefined 我读了这里所有的问题 但找不
  • lua中通过url下载文件

    Lua初学者在这里 我正在尝试通过 url 加载文件 但不知何故 我太愚蠢了 无法获取此处的所有代码示例来为我工作 如何在 Lua 中下载文件 但在运行时写入本地文件 从给定的url下载文件并将其存储到lua中的给定路径 socket re
  • 如何更改可选函数参数的默认值

    我需要更改全局变量S at a py from b py 但它被用作函数中的默认值a py a py S string def f s S print s print S b py import a def main a S another
  • Karate 支持是否在 html 报告中显示传入模拟服务器 API 请求的服务器端场景的断言或失败? [关闭]

    Closed 这个问题需要细节或清晰度 目前不接受答案 这可能是一个愚蠢的问题 或者可能已经得到回答 但我无法找到任何答案 我需要测试向特定端点或消费者发送 API 请求的微服务 我能够使用空手道成功编写模拟 并根据 服务器端 场景中发生的
  • Facebook 应用程序的 Facebook 集成配置错误

    我正在开发在社交网络上共享照片的 iPhone 应用程序 对于照片共享 我使用 Sharekit 我创建了 Facebook 应用程序并使用其 api 密钥和秘密 使用了正确的 api 密钥和秘密 当我尝试与此应用程序共享图像 甚至是简单的
  • Promise 被拒绝后抛出错误 - Q

    以下是使用 Q 的 Promise 的简短示例 这是 test1 js function testDefer var deferred Q defer fs readFile foo txt utf 8 function error tex
  • 如何重定向到servlet中的错误页面?

    我正在编写 servlet 如果出现异常 我将重定向到我的自定义错误页面 因为我已经这样做了 在 web xml 中
  • TCP服务器haskell字符串比较

    我有一个用 Haskell 编写的小型服务器 当我向它发送内容时 它应该评估发送的内容是否与 auth 函数中的密码 password 匹配 但它永远不是 True 我可以看到发送的消息已通过 因为它打印在 putStrLn msg 处 我
  • JavaScript 的“with”语句有合法用途吗?

    艾伦 斯托姆的评论回应我关于with陈述让我思考 我很少找到使用这种特定语言功能的理由 也从未考虑过它可能会带来什么麻烦 现在 我很好奇如何有效地利用with 同时避免其陷阱 你在哪里找到的with声明有用吗 今天我想到了另一个用途 所以我
  • 单一决策和行动陈述的首选风格是什么?

    对于支持不带括号的单一决策和操作的语言 例如以下示例 if var true doSomething 写这个的首选方式是什么 是否应该始终使用括号 还是应该将其使用保留为各个开发人员的偏好 此外 这种做法是否取决于代码块的大小 例如以下示例
  • 在 Spring/J2EE 应用程序中分离只读和读写

    我们在项目中使用 Spring Spring Data 和 JPA 对于生产服务器 我们希望设置数据库集群 以便所有读取查询都定向到一台服务器 所有写入查询都定向到另一台服务器 这显然需要对 DAO 的构建方式进行一些改变 如果到目前为止
  • UIWebview启用cookie

    我正在尝试访问需要 cookie 的特定 URLUIWebView但我无法访问它 因为 cookie 被禁用 所以我做了以下事情 启用cookie NSHTTPCookieStorage cookieStorage NSHTTPCookie
  • 无法确定条件表达式的类型? [复制]

    这个问题在这里已经有答案了 我刚刚遇到了这个 编写代码来演示 问题 public ICollection
  • jQuery:在提交表单之前执行一些操作

    我有一个页面 上面有一个表单 该表单包含一个文本框和一个提交按钮 提交表单时 通过单击按钮或在文本框中按 Enter 键 我想要进行查找 在本例中 使用 Bing 地图对邮政编码进行地理编码 然后像往常一样将表单提交到服务器 我当前的方法是