开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Wordpress Ajax表单提交2个提交按钮(保存和删除)如何让第二个按钮工作

要让第二个按钮工作，可以通过以下步骤实现：

在WordPress中创建一个包含两个提交按钮的Ajax表单。可以使用HTML和JavaScript来实现这个表单。
在JavaScript中，使用jQuery或其他类似的库来处理表单的提交事件。
给每个提交按钮分配一个唯一的ID或类名，以便在JavaScript中进行识别。
使用jQuery的click()方法或类似的事件监听器，为第二个按钮添加一个点击事件处理程序。
在点击事件处理程序中，使用Ajax来发送一个请求到服务器，执行删除操作。
在服务器端，接收到删除请求后，执行相应的删除操作，例如删除数据库中的相关数据。
在Ajax请求成功后，可以根据需要更新页面内容或显示成功消息。

总结：

WordPress Ajax表单提交2个提交按钮（保存和删除），可以通过JavaScript和Ajax来实现。通过为第二个按钮添加点击事件处理程序，发送一个删除请求到服务器，执行相应的删除操作。在成功删除后，可以更新页面内容或显示成功消息。

腾讯云相关产品推荐：

云服务器（CVM）：提供高性能、可扩展的云服务器实例，用于托管网站和应用程序。链接：https://cloud.tencent.com/product/cvm
云数据库 MySQL 版（CDB）：提供高可用、可扩展的关系型数据库服务，适用于存储和管理数据。链接：https://cloud.tencent.com/product/cdb
云函数（SCF）：无服务器计算服务，可用于处理和响应特定事件，如表单提交。链接：https://cloud.tencent.com/product/scf

相关搜索:Ajax表单提交、事件侦听器和更改提交按钮类型为什么我的按钮不能使用ajax和jquery提交表单？单击保存按钮后如何提交表单？如何使用ajax和一个提交按钮提交多个表单？如何使用onbeforeunload作为后退按钮，但防止表单提交和内部页面重定向如何停止重新提交表单的"后退"和"刷新"按钮？如何在codeigniter中使用ajax删除提交按钮并保存图像和显示图像？如何在pdf表单中编写提交按钮来询问用户是否要先保存？如何在没有第二个提交按钮的情况下让上传按钮提交文件php Symfony3 如何在表单和Woocommerce中的提交按钮之间添加空格？

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

不写一行代码，如何实现前端数据发送到邮箱？

经常在很多网站上都能看到类似的表单信息功能，用户只需要填写相关内容，点击提交按钮，就可以将表单内容发送到管理员邮箱。...稍加思考后，就会发现，本质上就是要将点击按钮和发送邮件功能进行绑定，那么有没有什么简单的方法呢？...“后端”的操作，来将前后按钮和发送邮件功能进行绑定。...（可选）使用 Ajax 虽然我们的需求已经实现，但是在刚刚点完发送之后，会跳转到一个新的页面为了页面不修改，我们需要使用AJAX提交表单，首先需要从下面的链接中下载对应的js文件到项目目录 https... 当然你也可以使用CSS、JS来让你的表单更加酷炫，但这不是本文要讨论的主要内容。

5.5K3 0

WordPress 后台样式：Button 按钮

上一篇讲了 WordPress 后台样式： Admin Notice 操作提示，今天继续，讲讲 WordPress 后台常用的按钮样式： WordPress 常用到按钮是表单的提交按钮，我们非常简单的使用...> 第一个参数代表 $text 代表按钮的文本，默认是“保存更改”。...第二个参数 $type 是按钮的 CSS class，包含 'primary'，'small' 和 'large'，默认是 'primary'，根据这个值的不同显示不同的样式。...第三个参数 name 是提交按钮的 input name，默认是“submit”，如果没有在 other_attributes 参数中提供 id 属性，那么第四个参数 $wrap 代表生成按钮是否会包含在...所以只要掌握好这几个 class，在 WordPress 后台根据自己的需求可以做出各种按钮。

2.4K2 0

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

一、表单重复提交的常见应用场景网络延迟的情况下用户多次点击submit按钮导致表单重复提交用户提交表单后，点击【刷新】按钮导致表单重复提交（点击浏览器的刷新按钮，就是把浏览器上次做的事情再做一次，因为这样也会导致表单重复提交...= true; //提交表单后，将表单是否已经提交标识设置为true return true; //返回true让表单正常提交 } else { return false; //返回false..."; //返回true让表单可以正常提交 return true; } （3）、验证码页面上添加验证码，不管验证输入正确与否，提交后均刷新验证码。...（4）、ajax提交加锁采用ajax方式提交表单时，设置一个布尔变量（true/false），当然其他类型变量也可以。...（5）、提交后重定向到一个提交成功的页面表单提交后跳转到另外一个成功页面。这样可以避免用户按F5导致的重复提交，浏览器也不会出现表单重复提交的警告，以及消除按浏览器前进和后退按导致的同样问题。

2.1K2 0

WordPress评论滑动拉链解锁myQaptcha修改为自动提交的方法

原理很简单：先用 css 隐藏评论提交按钮，然后将评论提交动作绑定到滑动解锁上即可。好吧，张戈好人做到底，整理一下详细的做法（发现很多朋友都喜欢看张戈罗里吧嗦。。。）...一、下载代码为了省去如何修改代码洋洋洒洒的几百字，张戈决定直接将修改好的代码打包分享出来：下载地址下载解压后，将得到的 myqaptcha 文件夹整体上传到 WordPress 主题目录下备用。...php 之后添加如下代码保存即可： include("myqaptcha/myQaptcha.php"); 三、修改代码 ①、评论框为了配合这个自动提交，我们必须修改一下评论框的提交按钮代码。...②、ajax 代码可以看出来，张戈博客这个滑动自动提交和 Ajax 评论提交是绝配。如果你博客的评论不是 ajax 模式（即点击提交评论页面会刷新），那么 ajax 代码这一步就不用做啦！...③、不动脑筋自动提交的原理很简单，说白了就是将原有的提交按钮用 css 样式隐藏掉，然后在滑动动作绑定一个点击隐藏的提交按钮的机制，这样用户滑动模块，就会自动点击那个隐藏的提交按钮了，从而实现自动提交

1.4K5 0

实战分析表单form中禁止自动提交

，找了很久，之后查找资料，知道表单form提交除了submit提交还有button也会提交，所以总结如何处理不然button 提交表单，在本文中，我们将讨论网页表单（form）中提交的两种方式。...这意味着当用户点击按钮时，表单不会执行提交操作。这种方法适用于需要在点击按钮后执行其他操作（如AJAX请求）的情况。...默认情况下，元素的类型为submit，这意味着当用户点击按钮时，表单将执行提交操作。通过将元素的type属性设置为button，我们可以阻止按钮的默认提交行为。.../button> 总结当需要在点击按钮后执行其他操作（如AJAX请求）时，可以在...当不需要执行表单提交，只需要执行其他操作（如JavaScript事件处理）时，可以将元素的type属性设置为button以阻止按钮的默认提交行为。

510 0

SpringBootRestFul快速入门

CustomerController.java 添加 /** * ajax操作：保存客户信息 * @param customer */ @PostMapping...",true)); } add.jsp //1、页面加载完成时，为保存按钮绑定点击事件 $("#saveBtn").click(function () { //2、点击事件中，发送...ajax请求到控制器，提交整个表单数据 $.ajax({ type:"post", url:"${pageContext.request.contextPath}/customer...; } } }); }); edit.jsp //2、页面加载完成时，为修改按钮绑定点击事件，点击按钮，ajax方式提交表单 $("#modifyBtn").click...{ //通过ajax，向控制器发送请求，请求删除该客户信息 $.ajax({ type:"delete", url:"${pageContext.request.contextPath

4481 0

WPJAM Basic 5.9 详细更新说明

首先还是自己去 Debug，我之前提供了详细的 WordPress 如何 debug 的教程，你参考处理，如果处理不了，提供 log，直接在本公众号留言，我看到，如果信息完备，然后感觉是 WPJAM...兼容 WooCommerce 之前后台文章列表开启「支持全面的 AJAX操作」，会让 WooCommerce 的订单和优惠券页面出现一些问题，最近接了一些 WooCommerce 的项目，仔细研究和处理了一下...数据按钮支持多个按钮 WPJAM_List_Table 和 WPJAM_Page_Action 的提交按钮支持多个按钮，比如我最新的小程序插件的「路径和二维码」的弹窗：这样，我就把原来的「生成二维码...」和「提交到微信搜索」的按钮合二为一，文章列表页面更加简洁，我只需要保留批量操作里面的「提交到微信搜索」即可。...Safari 浏览器不是提交按钮不能获取焦点而 document.activeElement 不是当前按钮的处理。

7.2K3 0

表单脚本

虽然现流行的大部分提交方式是通过ajax，但了解表单，对于ajax方式也是有重大帮助的！所以，大家不要看轻表单。...提交表单（1）提交按钮提交方式1：通用提交按钮方式2：自定义提交按钮 <button type="submit...如果<em>表单</em>没有<em>提交</em><em>按钮</em>，安回车键不会<em>提交</em><em>表单</em>。注意，通过上述方式<em>提交</em><em>表单</em>，浏览器会在将请求发送给服务器之前触发submit事件。这样就可以决定是否需要验证<em>表单</em>。...（2）利用onsubmit事件处理程序取消后续的<em>表单</em><em>提交</em>方式。我们项目中，请求通过<em>ajax</em><em>提交</em>，防重复<em>提交</em>的方式大致类似于上述第（2）种。...对<em>表单</em>字段的名称<em>和</em>值进行URL编码，使用“&”分隔；不发送禁用的<em>表单</em>字段；只发送勾选的复选框<em>和</em>单选<em>按钮</em>；不发送type为“reset”<em>和</em>“button”的<em>按钮</em>；选择框中每个选中的值单独条目发送

4.8K4 1

JSP 防止网页刷新重复提交数据

网页如何防止刷新重复提交与如何防止后退的解决方法提交后禁用提交按钮（大部分人都是这样做的）如果客户提交后,按F5刷新怎么办?...因为在默认情况下，用户提交表单之后可以通过后退按钮返回表单页面（而不是使用“编辑”按钮！），然后再次编辑并提交表单向数据库插入新的记录。这是我们不愿看到的。 ...那么，在那个我们不想让用户返回的页面是否也可以加入JavaScript代码呢？在这个页面中加入的JavaScript代码可用来产生点击前进按钮的效果，这样也就抵消了用户点击后退按钮所产生的动作。...，在写完第一个页面后跳到第二个页面，为了防止用户用后退返回到第一个页面，再重新提交第一个页面，我是当用户提交第一次提交第一个页面时，把插入数据库中的记录的自增长id号放到session里，当用户从第二个页面返回到第一个页面再一次提交该页面时...参考推荐：网页如何防止刷新重复提交与如何防止后退的解决方法

11.5K2 0

EasyNVR前端防止提交成功后多余操作提交

回到具体问题上来，有用户反应EasyNVR前端对于表单提交这一块用户体验不是很好。主要问题是表单在提交成功以后，提交按钮依然可以触发。居然有用户提出来，我们就要尽最大可能满足用户需求。...}) 从代码中我们不难看出，EasyNVR前端页面是通过触发Ajax来进行表单提交的。...整体的流程无非这两种： 1.点击提交按钮->触发ajax提交数据->提交成功->屏蔽提交按钮防止再次提交; 2.点击提交按钮->触发ajax提交数据->提交失败->保持提交按钮状态供再次提交；...首先我们抛开提交的内容，从提交的过程来说，在EasyNVR配置表单中我们没有只需要注重ajax请求动作的成功和失败；我们主要调用的函数就是success: function、error: function...下一篇将介绍如何实现当表单内容出现变化后可以提交，表单内容不变的情况下依然屏蔽提交按钮。

8071 0

富Web应用的架构与转化方法：Web应用系列第二篇

丰富的应用程序的标志之一是缺少页面重新加载和减少页面导航。例如，您在表单上输入数据，然后单击“提交”按钮。没有明显的等待响应。这是因为是使用了Ajax技术将数据传输到服务器并在后台接收响应。...工作单元可以是发票输入，其中发票输入的所有功能在一个页面上可用：创建，更新，删除和查询。我们将看到RichFaces如何能够大大降低复杂性并加速此类丰富应用程序的开发。...三、Ajax表单提交我们将看到的第一个特性，是能够提交表单数据并仅在页面的该部分调用JSF生命周期而无需重新加载页面。以下是声明注册表单的页面部分（简化以供讨论）： ?...发票输入表单周围添加了。删除了两个组件，因为页面的上半部分将与页面底部交互而不提交整个页面。 ?...探索Ajax表单提交已替换为其Ajax等效项。

3.5K2 0

【JS】741- JavaScript 闭包应用介绍

函数式编程灵活简洁，而语言对闭包的支持，让函数式编程拥有了灵魂。以实现一个可复用的确认框为例，比如在用户进行一些删除或者重要操作的时候，为了防止误操作，我们可能会通过弹窗让用户再次确认操作。...、取消按钮 // 添加确认按钮点击事件，事件函数中做dom清理工作并调用confirmCallback // 添加取消按钮点击事件，事件函数中做dom清理工作并调用cancelCallback...优雅解决按钮多次连续点击问题用户点击一个表单提交按钮，前端会向后台发送一个异步请求，请求还没返回，焦急的用户又多点了几下按钮，造成了额外的请求。...有时候多发几次请求最多只是多消耗了一些服务器资源，而另外一些情况是，表单提交本身会修改后台的数据，那多次提交就会导致意料之外的后果了。...无论是为了减少服务器资源消耗还是避免多次修改后台数据，给表单提交按钮添加点击限制是很有必要的。怎么解决呢？

8203 1

如何在 WordPress 中创建联系表格？

网站，并且我们想要添加一个功能，让他们可以联系他们所拥有的查询。...我们可以通过使用网站上的 WordPress 插件添加联系表格来做到这一点。因此，这将为你的访问者提供一种与你联系的方式，当他们需要帮助或有什么要分享的时候。让我们看看如何创建联系表格。...通过单击默认表单的设置选项删除默认联系表单。通过单击“添加新”按钮创建一个新表单。从以下给定选项中选择联系我们选项：空白表格、联系我们、报价请求、活动注册。当你单击它时，你的表单将被创建。...将创建一个简单的联系表单，其中包含名称、电子邮件、消息和提交按钮等字段。你可以通过在Ninja Forms插件选项中选择空白表单选项来根据需要添加更多字段。...要添加表单，请单击标题下方的添加表单选项。弹出窗口将出现并选择你在 Ninja Form 中创建的表单。然后单击“插入”，表单将插入到你的页面中。点击发布按钮。

2.8K2 1

Contact Form 7：最强大的 WordPress 联系表单插件

帮人做 WordPress 项目的时候，经常需要帮客户设置联系表单，一般我们都会推荐客户使用 Contact Form 7 这个 WordPress 插件。...Ajax 提交和 jQuery 表单插件等，并且还可以结合 Akismet 过滤垃圾邮件，同时也支持 CAPTCHA 反垃圾邮件。...Contact Form 7 安装和使用 Contact Form 7 安装非常简单，只需要在 WordPress 后台在线安装即可。...Contact Form 7 支持几乎所有的表单域元素，如：单选框、复选框、文本框、下拉菜单、按钮、文件上传等。...并且生成也非常简单，只需要点击下就可以生成一个自己所需要表单域，并且把生成的代码复制到表单和收到邮件中即可，使用非常简单，并且如果你懂英文的话，Contact Form 7 的官方站点有非常详细的文档教你怎么使用

8152 0

WordPress记住评论用户信息的js版本，直接操作cookie无视缓存

下面分享这个 js 代码，补充 WordPress 在缓存处理方面的不足：先前置说明一下，此 js 主要用于解决 WordPress 在百度云加速等 CDN 缓存开启下无法保存用户信息的问题，省的某些人不仔细看内容就别说啥...评论，就没有 comments-ajax.js，这时你可以将以上代码保存为 saveinfo.js ，然后引入到前台即可。...下面隐藏内容是张戈之前自己写的 js 代码，使用感觉没有 ZBlog 的完善感兴趣的可以参考看看展开二、自动保存不提供是否保存信息的选项，提交评论的时候，会自动保存用户信息到本地 cookies...>/saveinfo.js"> 三、自行选择功能区别：在上述功能的基础上，新增一个勾选框，让用户选择是否保存信息。...合并； ③、已记住的网站，如需修改更新用户信息，只需输入新的信息，重新提交一次即可刷新 cookie； ④、如果评论框中存在重置（id 为 reset）的按钮，那么只要点击重置就能清除已保存的用户信息

1.6K5 0

python测试开发django-162.ajax 提交表单，防重复提交（beforeSend）

前言 form 表单提交的时候，当快速点击提交按钮的时候，会触发多个请求过去，会导致重复添加。...前端页面前端form表单页面，2个输入框，一个提交按钮这里用ajax提交请求 /** 定义表单提交事件 */ function project_save...(); }) 遇到问题，当快速点提交按钮多次，会触发多个请求 beforeSend 禁用添加按钮解决办法，在点提交按钮，发请求之前，可以调用beforeSend 方法，添加一个disabled...location.href="/page/list_project/"; }else{ // 让按钮生效

1.3K1 0

求超大文件上传方案( Web )

使用传统的表单提交文件或是HTML5的FormData都是将文件“整块”提交，服务端取到该文件后再进行转移、重命名等操作，因此，无法实时保存文件的已上传部分。...所以真正在项目中用，还得依靠服务端来保存这些数据。关于如何将数据存在服务端，已经前端如何取数据，我在下面会讲到。...再加上你系统还有自己的业务逻辑，所以在服务端保存已上传文件数据是非常有必要的。而且保存数据和获取数据的函数都交给你来定义，抱着插件有足够的灵活性。...为了防止用户在两次上传间隔修改了文件，我们把文件的最后修改时间也传给服务端，让服务端进行比较，若时间不对应则返回已上传大小为0，重新上传此文件。再来看后台都要做哪些工作。...用于开启了断点需传 up.cancel(1);//删除队列中的某个文件，接收一个参数，表示删除第几个文件，可传入*删除队列中的所有文件 up.disable();//使选择文件按钮失效，不接收参数 up.ennable

3.7K4 0

ThinkPHP5.1表单令牌Token失效问题的解决

前言 ThinkPHP出于安全的考虑增加了表单令牌Token，由于通过Ajax异步更新数据仅仅部分页面刷新数据，就导致了令牌Token不能得到更新，紧接着的第二次新建或更新数据（提交表单时）失败——不能通过令牌的验证...在网上搜寻了很多，有好几种方法；看完觉得有一个最好： Ajax异步动态请求创建新令牌并更新到本地主要思路：在每次发送表单结束后（不管成功与否）通过Ajax异步请求一个新的表单令牌并保存到表单隐藏域中...，下次提交表单就使用新的表单令牌去通过。...表单按钮对象 * @param {文本} Modal 模块 * @param {文本} Controller 控制器 * @param {文本} Action 方法 * @param {...文本} Location Ajax加载页面的位置id * 使用方法：表单对象不用提交的任何设置，提交假按钮<a 设置onclick即可 * 注意： * 1.

1.9K4 1

jquery的form表单提交

jQuery是一个流行的JavaScript库，可以简化处理JavaScript的操作，包括表单提交。在本篇博客中，我们将介绍如何使用jQuery来实现表单提交操作。...在上面的表单中，我们有两个输入框用于输入姓名和邮箱，以及一个提交按钮。...表单提交通常会涉及到用户输入数据的验证、显示提交结果等功能。下面以一个简单的用户注册表单为例，结合实际应用场景，介绍如何使用jQuery实现表单提交并展示提交结果。...HTML表单首先，我们创建一个用户注册表单，包括姓名、邮箱和密码等字段。同时，我们添加一个用来显示提交结果的区域。...Form表单由包含在和标签之间的多个表单元素组成。用户可以在表单中输入文本、选择选项、上传文件等，然后通过表单提交按钮将这些数据发送给服务器。

841 0

扒一扒使用boostrap-fileinput上传插件遇到的坑，Bootstrap-fileinput上传插件的使用详解，「建议收藏」

由于公司项目的需求，需要实现动植物名录的添加，包括姓名等信息和图片等，需要使用bootstrap-fileinput的上传插件，在提交添加界面表单数据的同时上传一张或者多张图片，并将上传的图片保存到本地磁盘中...(本文是f:盘的目录下)，在在实现的时候，不适用bootstrap-fileinput上传插件本身的上传按钮（因为本身的按钮只能上传图片），需要点击提交，将表单的其他信息和图片一起提交到后台。...实现思路：原来我的思路是不使用插件的上传按钮，而自己通过js将插件里面的多文件与表单一起提交，但是到后台只能获取到最后一个文件，我不是文件数组。...我查了很多办法好像都没办法，后来改变思路：还是自己用js触发提交表单，只是先将表单其他数据传到后台保存返回数据库id,然后通过$(‘#add_bachPic’).fileinput(‘upload’);...，通过ajax提交表单的信息，在提交成功的success响应方法中，触发图片上传的方法。

2.7K2 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭