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

js模拟form提交的一些问题

当在页面中需要进行post提交时,一般的做法是将控件放入form标签中,加入一个submit按钮进行post方式的提交。

遇到的问题

页面中有两个Tab进行切换,一个tab中需要获取用户输入的值进行post提交到search页面进行搜索操作,另一个tab中是获取用户输入的值进行get方法提交到另一个页面进行查询操作,那么那个按钮就不能使用submit类型的按钮了(后来发现那样也可以实现相应的功能),那么想到的方法就是模拟一个form进行post提交。

解决的方法

在页面中放入下面的模拟form

< form  id ="formSearch"  method ="post"  action ="/search.aspx" >
    
< input  type ="hidden"  id ="hiddenWord"  name ="word"  value =""   />
</ form >

在第一个tab对应的按钮事件中添加如下的js代码

$( " #hiddenWord " ).val($( " #word " ).val());
$( " #formSearch " ).submit();

id为word的控件为用户输入条件的input控件

这样就实现了js的模拟post提交,实际上这样还解决了aspx页面的form中嵌套from标签的问题

编码的问题

当前的页面编码为UTF-8的编码,而search.aspx的编码为GB2312,所以post过去的数据出现了乱码,当然也可以使用js的encodeURIComponent进行编码

实际上在aspx页面的头部page注册时有这样一个属性:ResponseEncoding

加入此属性后aspx页面的头部应该像下面这个样子

<% @ Page Language = " C# "  AutoEventWireup = " true "  EnableViewState = " false "  ResponseEncoding = " GB2312 "   %>

这样就解决了页面编码不一致的问题。

另一个小技巧

在submit按钮post前可以进行自定义函数的检查,即可以阻止掉post的提交过程

在submit的时候执行一些自定义的操作,需要先用preventDefault阻止提交

$( " #id_form " ).submit( function (e) { e.preventDefault(); doSomething(); e.target.submit();})

click的时候就不需要,直接操作就可以

$( " #id_save " ).click( function (e) { doSomething(); })

相关文章:

  • c#程序在没有安装SQL2000机器上调用DTS包出错的解决办法【整理】
  • MSSQl分布式查询
  • 《大话设计模式》读书笔记-第4章 开放-封闭原则
  • Struts入门实例
  • MVC入门学习笔记(三)
  • CentOS服务器配置系列--telnet服务器
  • visual scene interpretation
  • 如何用JSP/Java程序免费向手机发消息?
  • Bigpoint 发布全球首款Silverlight网页游戏(转载)
  • VS2008的动、静态编译(转)
  • python 批量修改密码
  • 计算机达人成长之路(20)
  • java线程同步概述
  • jQuery id选择器中特殊字符的处理
  • C#类学习-1
  • 【跃迁之路】【585天】程序员高效学习方法论探索系列(实验阶段342-2018.09.13)...
  • Create React App 使用
  • Dubbo 整合 Pinpoint 做分布式服务请求跟踪
  • JavaScript-Array类型
  • javascript从右向左截取指定位数字符的3种方法
  • Js基础知识(四) - js运行原理与机制
  • MyEclipse 8.0 GA 搭建 Struts2 + Spring2 + Hibernate3 (测试)
  • MySQL的数据类型
  • Python 使用 Tornado 框架实现 WebHook 自动部署 Git 项目
  • Redis学习笔记 - pipline(流水线、管道)
  • spark本地环境的搭建到运行第一个spark程序
  • Vue.js 移动端适配之 vw 解决方案
  • 给新手的新浪微博 SDK 集成教程【一】
  • 猫头鹰的深夜翻译:JDK9 NotNullOrElse方法
  • 在Docker Swarm上部署Apache Storm:第1部分
  • 《TCP IP 详解卷1:协议》阅读笔记 - 第六章
  • elasticsearch-head插件安装
  • 回归生活:清理微信公众号
  • 微龛半导体获数千万Pre-A轮融资,投资方为国中创投 ...
  • ​html.parser --- 简单的 HTML 和 XHTML 解析器​
  • #我与Java虚拟机的故事#连载09:面试大厂逃不过的JVM
  • (9)YOLO-Pose:使用对象关键点相似性损失增强多人姿态估计的增强版YOLO
  • (libusb) usb口自动刷新
  • (八)五种元启发算法(DBO、LO、SWO、COA、LSO、KOA、GRO)求解无人机路径规划MATLAB
  • (大众金融)SQL server面试题(1)-总销售量最少的3个型号的车及其总销售量
  • (二)学习JVM —— 垃圾回收机制
  • (附源码)apringboot计算机专业大学生就业指南 毕业设计061355
  • (附源码)ssm失物招领系统 毕业设计 182317
  • (转)fock函数详解
  • ****Linux下Mysql的安装和配置
  • .NET 解决重复提交问题
  • .NET 中选择合适的文件打开模式(CreateNew, Create, Open, OpenOrCreate, Truncate, Append)
  • .NET的微型Web框架 Nancy
  • .NET开源项目介绍及资源推荐:数据持久层 (微软MVP写作)
  • ?
  • @cacheable 是否缓存成功_Spring Cache缓存注解
  • @JoinTable会自动删除关联表的数据
  • @RequestBody与@ResponseBody的使用
  • [20190113]四校联考
  • [AutoSar]BSW_OS 01 priority ceiling protocol(PCP)