`

jquery 中禁止表单多次提交

阅读更多
  在jquery 中,防止提交多次表单其实是很简单的,代码如下:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <title>Safe submit with jQuery</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/
jquery/1.7.1/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
               $("#submit").click(function(

                             $(":input").attr("disabled", true);
               var dataString =  'name=test';
               $.ajax({
               type: "POST",
               url: "1.php",
               data: dataString,
               success: function(){
                             $(":input").removeAttr('disabled');
               }
               });
               return false;
               });
            });
        </script>
    </head>
    <body>
        <form>
            Name:<input type="test" name="name" id="name" />
            <input type="submit" name="submit" id="submit" />
        </form>
    </body>
</html>

分享到:
评论

相关推荐

    禁止表单重复提交和网页加载的等待效果

    在提供的压缩包"WebSite防止多次提交和等待效果"中,很可能包含了实现以上功能的示例代码,包括HTML、CSS和JavaScript文件。通过研究这些文件,你可以更好地理解这两种技术的实现细节,并应用到自己的项目中。记得在...

    防止Layui form表单重复提交的实现方法

    在上述函数中,如果需要在禁止表单默认提交行为的同时,与服务器进行数据交互,则可以使用JavaScript的XMLHttpRequest或者现代的Fetch API来异步提交表单数据。使用AJAX提交表单数据的好处是,可以避免页面刷新,...

    jquery提交form表单时禁止重复提交的方法

    使用jQuery可以方便地操作DOM以及处理事件,它提供了一种简单的方法来阻止表单在一次提交之后的再次提交。具体的做法通常包括以下几种: 1. 利用HTML表单自带的提交控制属性:在表单提交按钮上添加一个属性,比如`...

    10个超棒jQuery表单操作代码片段

    5. **防止多次提交表单** 这是解决用户可能多次点击提交按钮导致多次请求问题的常见方法。在表单提交时,将一个标志存储在jQuery的数据缓存中,以此来判断是否已提交过表单。如果已提交,则禁用提交按钮。 ```...

    jquery 防止表单重复提交代码

    当用户快速连续点击提交按钮,或者由于网络延迟,页面可能在第一次提交请求未完成时再次发送请求,导致数据被多次插入或更新。为了防止这种情况,我们需要在用户点击提交按钮后禁用该按钮,直到表单提交完成。 以下...

    阻止表单提交按钮多次提交的完美解决方法

    在Web开发中,用户交互的一个常见问题是表单的多次提交,这可能导致数据冗余或系统错误。本文将详细探讨如何阻止表单提交按钮的多次提交,确保数据的一致性和正确性。 首先,理解问题的根源。当用户快速连续点击...

    几种防止表单重复提交的方法

    表单重复提交是在多用户Web应用中最常见、带来很多麻烦的一个问题。有很多的应用场景都会遇到重复提交问题,比如: 点击提交按钮两次。 点击刷新按钮。 使用浏览器后退按钮重复之前的操作,导致重复提交表单。 使用...

    防止用户将表单重复提交的方法汇总

    表单重复提交是在多用户Web应用中最常见、带来很多麻烦的一个问题。有很多的应用场景都会遇到重复提交问题,比如: 点击提交按钮两次。 点击刷新按钮。 使用浏览器后退按钮重复之前的操作,导致重复提交表单。 使用...

    jQuery实现防止提交按钮被双击的方法

    在使用JavaScript和jQuery进行Web开发时,防止用户在表单提交过程中双击提交按钮是一项常见的需求。双击提交按钮可能会导致表单数据被重复发送,从而产生错误的提交结果或者增加服务器的负担。因此,如何有效地防止...

    jQuery 常用代码集锦(必看篇)

    在表单操作中,有时候需要禁止多次递交表单,避免用户不小心多次点击提交按钮而导致服务器接收到重复的请求。通过判断表单是否已经被提交过,可以在表单数据已经被处理后禁用提交按钮,防止用户重复提交。 清除所有...

    Gravity-Forms--Disable-Submit:提交表单后,禁用“重力表单”表单中的“提交”按钮(例如,快十倍!!)。

    在处理用户提交的表单时,确保表单提交按钮在点击后被禁用是一个重要的用户体验优化策略,这可以防止用户无意中多次提交同一表单,从而避免数据冗余或处理混乱。在“重力表单-禁用提交”的场景中,我们将讨论如何...

    jQuery实现提交按钮点击后变成正在处理字样并禁止点击的方法

    在Web开发中,常常会遇到需要在表单提交时防止用户重复点击提交按钮的情况,以免造成多次提交数据,或是因多次请求给服务器造成不必要的负担。这时,我们可以利用jQuery来实现一个提交按钮,在点击后变成“正在处理...

    漂亮表单验证和密码强度的验证

    在前端验证中,我们可以通过监听表单的提交事件,对每个输入字段进行检查。例如,检查邮箱格式是否正确,电话号码是否合法,用户名是否存在特殊字符等。此外,还可以使用CSS(如`reg.css`)来美化错误提示,使用户更...

    前端防止用户重复提交js实现代码示例

    前端防止用户重复提交是Web开发中常见的需求,主要用于防止用户在表单提交后因为网络延迟等原因多次点击提交按钮,或者通过快速连续的操作来重复提交数据到服务器。这可能导致服务器接收到重复的数据,给业务处理...

    jQuery实现按钮只点击一次后就取消点击事件绑定的方法

    本文将深入探讨如何使用jQuery实现这样一个功能,即按钮被点击一次后,其点击事件自动解除绑定,从而防止多次触发。 首先,我们需要创建一个HTML按钮元素,为其设置一个唯一的ID,以便在jQuery中选择和操作。以下是...

    js控制按钮,防止频繁点击响应的实例

    在实际应用中,这种防止频繁点击的策略可以应用于各种场景,例如提交表单、加载更多数据或发送网络请求等。它不仅可以避免用户因多次点击而导致的重复操作,还可以帮助防止服务器端的压力过大,确保系统稳定运行。 ...

    第三代移动WEB内核小程序风口-逐浪CMS2 x3.9.3全面发布

    ■修复:多文件上传,被禁止的上传的文件(exe等危险文件)显示Bug ■扩展:使用新版本Jquery.js(升级到全新的v3.2.1) ■修复:节点链接Bug ■修复:单页--只允许首页生成 ■修复:扩展--运行SQL语句增加二次密码校验 ...

    大名鼎鼎SWFUpload- Flash+JS 上传

     file_upload_limit : 10, 限定用户一次性最多上传多少个文件,在上传过程中,该数字会累加,如果设置为“0”,则表示没有限制  file_queue_limit : 2, 上传队列数量限制,该项通常不需设置,会根据file_upload_...

Global site tag (gtag.js) - Google Analytics