当前位置: 首页 > news >正文

jquery获取表单值的利器:serialize()

前台:[切记:每个表单元素, 都应该带有name, 否则是取不到的。]

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default3.aspx.cs" Inherits="Default3" %> <!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"> <head runat="server"> <title></title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> function test() { $("#Action").val(1); var vals = $("#tableForm :input").serialize(); //var vals = $("#form1").serialize();//两种都可以,但后一种会多取__ViewState这个系统hidden $.post("Default3.aspx", vals, function (data) { alert("前台取得值:\n" + vals+"\n后台取得值:\n"+data); }); } </script> </head> <body> <form id="form1" runat="server"> <table id="tableForm" style="border-collapse:collapse;" cellpadding="5" cellspacing="2" border="1"> <tr><td>姓名:</td><td><input id="Name" name="Name" type="text" value="刘 军" /><input id="Action" name="Action" type="hidden" value="0" /></td></tr> <tr><td>密码:</td><td><input id="Pwd" name="Pwd" type="password" value="123456" /></td></tr> <tr><td>性别:</td><td> <input name="Gender" type="radio" checked="checked" value="Male" />男&nbsp;&nbsp; <input name="Gender" type="radio" value="Female" />女</td> </tr> <tr><td>爱好:</td><td> <input id="Checkbox1" type="checkbox" checked="checked" name="Hobby" value="1" />足球&nbsp; <input id="Checkbox2" type="checkbox" checked="checked" name="Hobby" value="2" />象棋</td> </tr> <tr><td>留言:</td><td><textarea id="Note" name="Note" cols="20" rows="2">+ |</textarea></td></tr> <tr><td>籍贯:</td><td> <select id="Select1" name="Home" > <option value="">---请选择---</option> <option value="湖南" selected="selected">湖南</option> <option value="湖北">湖北</option> </select></td> </tr> <tr><td colspan="2"><input id="Button1" type="button" value="测试" οnclick="test()" /></td></tr> </table> </form> </body> </html>


后台:

using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.Text; public partial class Default3 : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { if (Request.Form["Action"] == "1") { Ajax(); } } private void Ajax() { StringBuilder sb = new StringBuilder(); foreach (string s in Request.Form.AllKeys) { sb.AppendFormat("{0}: {1}\n",s,Request.Form[s] ); } Response.Write(sb.ToString()); Response.End(); } }


—————————————— 结果 —————————————

前台取得值:

Name=%E5%88%98+%E5%86%9B&Action=1&Pwd=123456&Gender=Male&Hobby=1&Hobby=2&Note=%2B++%7C&Home=%E6%B9%96%E5%8D%97
后台取得值:
Name: 刘 军
Action: 1
Pwd: 123456
Gender: Male
Hobby: 1,2
Note: + |
Home: 湖南

相关文章:

  • COGS.264.数列操作(分块 单点加 区间求和)
  • HDU 2196 Computer 经典树形DP
  • 【python】-字典的使用
  • Android Development Tools for Eclipse.pdf
  • 推荐引擎算法学习导论
  • 使用 RAID 与 LVM 磁盘阵列技术
  • C#脚本实践(六): 脚本相对于C++的优势
  • 二维数组作为函数参数传递剖析(转载)
  • 基于贝叶斯平均的产品排序方法
  • Oracle Database Instant Client即时客户端配置使用
  • XML技术
  • 非正常关闭数据库服务的不同告警信息的表现的测试
  • 小甲鱼OD学习第10讲
  • mysql基本使用
  • web前端【第十篇】jQuery基本语法
  • #Java异常处理
  • 【399天】跃迁之路——程序员高效学习方法论探索系列(实验阶段156-2018.03.11)...
  • 【翻译】babel对TC39装饰器草案的实现
  • 【前端学习】-粗谈选择器
  • 10个最佳ES6特性 ES7与ES8的特性
  • 2017-08-04 前端日报
  • Android Volley源码解析
  • Android 初级面试者拾遗(前台界面篇)之 Activity 和 Fragment
  • Django 博客开发教程 8 - 博客文章详情页
  • javascript 哈希表
  • PAT A1120
  • Vue.js 移动端适配之 vw 解决方案
  • Vue源码解析(二)Vue的双向绑定讲解及实现
  • Webpack4 学习笔记 - 01:webpack的安装和简单配置
  • 讲清楚之javascript作用域
  • 通过几道题目学习二叉搜索树
  • 微服务框架lagom
  • 项目管理碎碎念系列之一:干系人管理
  • 小程序上传图片到七牛云(支持多张上传,预览,删除)
  • 基于django的视频点播网站开发-step3-注册登录功能 ...
  • ​​​​​​​sokit v1.3抓手机应用socket数据包: Socket是传输控制层协议,WebSocket是应用层协议。
  • ​Z时代时尚SUV新宠:起亚赛图斯值不值得年轻人买?
  • ​插件化DPI在商用WIFI中的价值
  • # 数据结构
  • #{}和${}的区别是什么 -- java面试
  • #Ubuntu(修改root信息)
  • #我与Java虚拟机的故事#连载09:面试大厂逃不过的JVM
  • (03)光刻——半导体电路的绘制
  • (cos^2 X)的定积分,求积分 ∫sin^2(x) dx
  • (Matlab)基于蝙蝠算法实现电力系统经济调度
  • (Mirage系列之二)VMware Horizon Mirage的经典用户用例及真实案例分析
  • (poj1.2.1)1970(筛选法模拟)
  • (Redis使用系列) Springboot 使用redis的List数据结构实现简单的排队功能场景 九
  • (二)学习JVM —— 垃圾回收机制
  • (附源码)ssm基于jsp高校选课系统 毕业设计 291627
  • (转)EOS中账户、钱包和密钥的关系
  • (转)淘淘商城系列——使用Spring来管理Redis单机版和集群版
  • (轉貼) 2008 Altera 亞洲創新大賽 台灣學生成果傲視全球 [照片花絮] (SOC) (News)
  • ./configure、make、make install 命令
  • .Net core 6.0 升8.0