jQuery的serialize()方法通过序列化表单值,创建URL编码文本字符串,我们就可以选择一个或多个表单元素,也可以直接选择form将其序列化,如:

<form action="">
First name: <input type="text" name="FirstName" value="Bill" /><br />
Last name: <input type="text" name="LastName" value="Gates" /><br />
</form>
$(document).ready(function(){
console.log($("form").serialize()); // FirstName=Bill&LastName=Gates
});

这样,我们就可以把序列化的值传给ajax()作为url的参数,轻松使用ajax()提交form表单了,而不需要一个一个获取表单中的值然后传给ajax(),举例如下:

$.ajax({
type: 'post',
url: 'your url',
data: $("form").serialize(),
success: function(data) {
// your code
}
});

使用$.post()、$.get()和$.getJSON()也是一样的:

$.post('your url', $("form").serialize(), function(data) {
// your code
}
}); $.get('your url', $("form").serialize(), function(data) {
// your code
}
}); $.getJSON('your url', $("form").serialize(), function(data) {
// your code
}
});

通过脚本获取form表单的数值而不是submit的更多相关文章

  1. serialize可以获取form表单里面的数值

    serialize属性 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  2. java:JavaScript2:(setTimeout定时器,history.go()前进/后退,navigator.userAgent判断浏览器,location.href,五种方法获取标签属性,setAttribute,innerHTML,三种方法获取form表单信息,JS表单验证,DOM对象,form表单操作)

    1.open,setTimeout,setInterval,clearInterval,clearTimeout <!DOCTYPE> <html> <head> ...

  3. 5 获取Form表单取值

    #form表达提交@app.route("/data",methods=['GET','POST']) #methods 让当前路由支持GET 和 POST 方式def data( ...

  4. jquery获取form表单内容以及绑定数据到form表单

    在日常开发的过程中,难免会用到form表单,我们需要获取表单的数据保存到数据库,或者拿到后台的一串json数据,要将数据绑定到form表单上,这里我写了一个基于jquery的,formHelp插件,使 ...

  5. JS获取form表单数据

    以下代码可放在一个js文件中,以便通用: //获取指定表单中指定标签对象 function getElements(formId, label) { var form = document.getEl ...

  6. 3..jquery的ajax获取form表单数据

    jq是对dom进行的再次封装.是一个js库,极大简化了js使用 jquery库在js文件中,包含了所有jquery函数,引用:<script src="jquery-1.11.1.mi ...

  7. 获取form表单默认提交的返回值

    1.经常用form表单提交的小伙伴有没有发现,form表单默认的提交是没有返回值的,而且默认提交成功之后是跳转,跳转的action的路径,下面写一下默认的提交如何获取到form表单的返回值json,并 ...

  8. html基础:jquery的ajax获取form表单数据

    jq是对dom进行的再次封装.是一个js库,极大简化了js使用 jquery库在js文件中,包含了所有jquery函数,引用:<script src="jquery-1.11.1.mi ...

  9. node服务器获取form表单

    搭建好服务器后 (前言,本文只是介绍form表单直接提供给 本页面数据,即在不刷新页面的前提下更改数据) 在public里面添加index.html <!DOCTYPE html> < ...

随机推荐

  1. cookie设置在特定时间点过期的方法

    假设需求为:在当天晚上0:00过期. 方法: 得到当天晚上0:00这个时间点的一个时间. function getNextDate(){        var d = new Date(),      ...

  2. XSS 跨站脚本攻击(Cross Site Scripting)

    xss表示Cross Site Scripting(跨站脚本攻击),它与SQL注入攻击类似,SQL注入攻击中以SQL语句作为用户输入,从而达到查询/修改/删除数据的目的,而在xss攻击中,通过插入恶意 ...

  3. PtH(hash传递攻击)原理探秘

    背景知识 Windows 横向渗透的两种方式 1.hash传递攻击,通过传递NTLM-Hash,登录机器,简称PtH: 2.ticket传递攻击,通过传递kerberos的ticket,登录机器,简称 ...

  4. vue组件定义方式

    一.全局组件 <div id="box"> {{msg}} <my-aaa></my-aaa> </div> var Home = ...

  5. Centos 安装yum,安装ansible

    今天使用centos安装ansible,发现域名默认安装是未注册的.提示: This system is not registered to Red Hat Subscription Manageme ...

  6. [C#/Java] C#中调用Servlet示例

    需求 通用消息接口使用servlet作为服务器端服务接口,第三方应用程序通过http post的方式调用servlet,实现与通用消息接口的调用连接. 参数说明如下: msgTitle:消息标题,描述 ...

  7. centos7下安装nmon后,无法运行,提示 cannot execute binary file或/lib64/ld64.so.1不存在

    在centos 7.1上安装nmon后,从管网(http://nmon.sourceforge.net/pmwiki.php?n=Site.Download)下载tar包解压后,两台机器一台提示 ca ...

  8. MySQL的btree索引和hash索引的区别 (转)

    Hash 索引结构的特殊性,其检索效率非常高,索引的检索可以一次定位,不像B-Tree 索引需要从根节点到枝节点,最后才能访问到页节点这样多次的IO访问,所以 Hash 索引的查询效率要远高于 B-T ...

  9. Spark2 Dataset DataFrame空值null,NaN判断和处理

    import org.apache.spark.sql.SparkSession import org.apache.spark.sql.Dataset import org.apache.spark ...

  10. web.xml之context-param,listener,filter,servlet加载顺序及其周边

    先以加载spring为例子看看加载顺序的作用: Spring加载可以利用ServletContextListener 实现,也可以采用load-on-startup Servlet 实现,但比如fil ...