<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>FormData收集表单信息</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.2.0.min.js"></script>
</head>
<body>
<form name="the" action="serve/serve.php" method='post'>
<table>
<tr>
<td>用户名<input type="text" name="username"></td>
</tr>
<tr>
<td>密码 <input type="password" name="pwd"></td>
</tr>
<tr>
<td><input type="submit" value="登陆"></td>
</tr>
</table>
</form>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("form").submit( function () {
//使用 FormData 对象收集表单数据
var FormData = $("form[name=the]").serialize(); //批量获取了数据
var FormData = $("form[name=the]").serializeArray(); //并且转换为Json格式数据
console.log(FormData); /*
* 选择传输的 FormData 数据
* 进行 AJAX 数据验证
*/ alert(FormData)
return false; //设置为 false 这样表单提交就不会页面跳转
});
})
</script>
</html>

FormData收集表单信息&并且转化为Json格式进行提交验证的更多相关文章

  1. js 表单内容使用ajax以json格式混合提交

    脚本代码 function submitForm(){    var post_data = $("#form1").getdict();    var data_dict = { ...

  2. 利用Shell脚本将MySQL表中的数据转化为json格式

    脚本如下: #!/bin/bash mysql -s -phello test >.log <<EOF desc t1; EOF lines="concat_ws(',', ...

  3. ajax+FormData+javascript实现无刷新表单信息提交

    ajax+FormData+javascript实现无刷新表单信息提交 原理: dom收集表单信息,利用FormData快速收集表单信息  ,实例化表单数据对象 同时收集fm的表单域信息. var f ...

  4. ajax无刷新方式收集表单并提交表单

    ajax无刷新方式收集表单有两种方式, 一个是使用html5的FormData.一个是传统的方式. 一,FormData,在主流的浏览器中可以用,IE不好用啊. 另外,FormData使用有两个条件, ...

  5. ThinkPHP中create()方法自动验证表单信息

    自动验证是ThinkPHP模型层提供的一种数据验证方法,可以在使用create创建数据对象的时候自动进行数据验证. 原理: create()方法收集表单($_POST)信息并返回,同时触发表单自动验证 ...

  6. Servlet——提交表单信息,Servlet之间的跳转

    HTML表单标签:<form></form> 属性: actoion:  提交到的地址,默认为当前页面 method:  表单提交方式 有get和post两种方式,默认为get ...

  7. 关于serialize() FormData serializeArray()表单序列化

    serialize()  FormData  serializeArray()都是序列化表单,实现表单的异步提交 但是serialize()和serializeArray()都是只能序列化表单中的数据 ...

  8. FormData 和表单元素(form)的区别

    Form 元素 <form>元素表示文档中的一个区域,此区域包含交互控件,用于向 Web 服务器提交信息(文件.字符).下面称之为表单元素或表单. 要向 Web 服务器提交信息,我们必须要 ...

  9. name属性作用+使用$.post()取代name属性在提交表单信息中的作用

    name的用途 1)主要是用于获取提交表单的某表单域信息, 作为可与服务器交互数据的HTML元素的服务器端的标示,比如input.select.textarea.框架元素(iframe.frame.  ...

  10. element 关闭弹窗时清空表单信息

    关闭弹窗时清空表单信息: // 弹框关闭时清空信息 closeDialog () { this.$nextTick(() => { this.$refs['createModelForm'].c ...

随机推荐

  1. MP逻辑删除

    在实体类中加上@TableLogic注解 在配置类中加入逻辑删除插件

  2. [Leetcode 111]二叉树的最短深度 BFS/DFS

    题目 给定二叉树,求最短路径包含的节点个数 https://leetcode.com/problems/minimum-depth-of-binary-tree/ Given a binary tre ...

  3. ASP.NET WEBAPI oken验证

    看了下网上关于.net webAPI 的案例全是坑 验证成功了不被微信服务器接收 微信客服有找不到,提问也没人回 自己测试好几个小时 终于发现返回结果只要个string 双引号都不用加 public ...

  4. 02 docker的基本用法

    本章内容 1.OCI 2.docker核心组件--Cgroup与runC 3.docker的架构 4.docker的基本操作 5.安装docker环境 6.创建第一个容器 6.docker容器的状态变 ...

  5. python 每天一个知识点 对文件的操作

    对文件的操作: 操作 功能 文件对象 = open(file,mode,encoding) 打开文件获取文件对象 文件对象.read(num) 读取指定长度字节,不指定num读取文件全部 文件对象.r ...

  6. mysql数据迁移,通用windows->linux,linux->windows

    1. 将用到的数据库文件夹直接拷贝到目标文件夹,mysql5.7在linux中默认在var/lib/mysql,将data下ibdata1也要拷贝进去 2. linux下需要将所有者root改为mys ...

  7. xlwings读取一整个excel文件xlsx的第一sheet到pandas.DataFrame的方法

    为什么不用:pd.read_excel ? 因为 pd 使用 openpyxl 读取excel文件,有时候xlsx文件是由ApachIO产生的读取进去会出错,换个方式,用xlwings(基于pywin ...

  8. iview 中Modal组件点击确定后验证信息不通过则不关闭弹窗方法

    <Modal v-model="isTemManageShow" title="管理模板" @on-ok="ok" :loading= ...

  9. element plus按钮点击后不会自动失去焦点的解决方案及Vue3中如何挂载全局函数并在组件中使用

    一.element plus按钮点击后不会自动失去焦点,该如何解决? 在按钮点击点击回调中增加以下代码: event.target.blur() if (event.target.nodeName = ...

  10. Unity打Android包报错总结 长期更新

    报错1  Failed to compile resources with the following parameters: -bootclasspath "E:\software\And ...