jquery+ajax实现直接提交表单实例分析


Posted in Javascript onJune 17, 2016

本文实例讲述了jquery+ajax实现直接提交表单的方法。分享给大家供大家参考,具体如下:

这里给出查看帮助文档的例子

<script src="jquery-1.4.4.js"></script>
<script>
$(function(){
  $("#results").append( "<tt>" + $("form").serialize() + "</tt>" );
});
</script>
<p id="results"><b>Results: </b> </p>
<form>
 <select name="single">
  <option>Single</option>
  <option>Single2</option>
 </select>
 <select name="multiple" multiple="multiple">
  <option selected="selected">Multiple</option>
  <option>Multiple2</option>
  <option selected="selected">Multiple3</option>
 </select><br/>
 <input type="checkbox" name="check" value="check1"/> check1
 <input type="checkbox" name="check" value="check2" checked="checked"/> check2
 <input type="radio" name="radio" value="radio1" checked="checked"/> radio1
 <input type="radio" name="radio" value="radio2"/> radio2
</form>

界面显示的内容是

jquery+ajax实现直接提交表单实例分析

直接使用ajax提交表单传递参数

$.ajax({
   type: "POST",
   url: url,
   data: $('#form1').serialize(),
   success: function(msg){
    alert( "Data Saved: " + msg );
   }
});

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript与函数式编程解释
Apr 27 Javascript
基于JavaScript实现表单密码的隐藏和显示出来
Mar 02 Javascript
JS封装的自动创建表格的实现代码
Jun 15 Javascript
Javascript之深入浅出prototype
Feb 06 Javascript
详解angularjs 关于ui-router分层使用
Jun 12 Javascript
ExtJs的Ext.Ajax.request实现waitMsg等待提示效果
Jun 14 Javascript
使用vue-resource进行数据交互的实例
Sep 02 Javascript
vue-cli3 项目从搭建优化到docker部署的方法
Jan 28 Javascript
Vue项目部署的实现(阿里云+Nginx代理+PM2)
Mar 26 Javascript
微信小程序 扭蛋抽奖机css3动画实现详解
Jul 19 Javascript
JavaScript严格模式不支持八进制的问题讲解
Nov 07 Javascript
JavaScript文档对象模型DOM
Nov 20 Javascript
jQuery UI Bootstrap是什么?
Jun 17 #Javascript
JS模拟bootstrap下拉菜单效果实例
Jun 17 #Javascript
JavaScript获取当前url根目录(路径)
Jun 17 #Javascript
下一代Bootstrap的5个特点 超酷炫!
Jun 17 #Javascript
JS实现的自定义显示加载等待图片插件(loading.gif)
Jun 17 #Javascript
基于Bootstrap的后台管理面板 Bootstrap Metro Dashboard
Jun 17 #Javascript
基于Bootstrap的UI扩展 StyleBootstrap
Jun 17 #Javascript
You might like
ecshop后台编辑器替换成ueditor编辑器
2015/03/03 PHP
浅析Yii2 GridView 日期格式化并实现日期可搜索教程
2016/04/22 PHP
thinkPHP+PHPExcel实现读取文件日期的方法(含时分秒)
2016/07/07 PHP
使用Laravel中的查询构造器实现增删改查功能
2019/09/03 PHP
jQuery EasyUI 中文API Layout(Tabs)
2010/04/27 Javascript
高效的表格行背景隔行变色及选定高亮的JS代码
2010/12/04 Javascript
AngularJS中取消对HTML片段转义的方法例子
2015/01/04 Javascript
JS交换变量的方法
2015/01/21 Javascript
jQuery读取XML文件内容的方法
2015/03/09 Javascript
基于jquery实现简单的分页控件
2016/03/17 Javascript
js实现页面跳转的几种方法小结
2016/05/16 Javascript
javascript中JSON.parse()与eval()解析json的区别
2016/05/19 Javascript
KnockoutJS 3.X API 第四章之表单submit、enable、disable绑定
2016/10/10 Javascript
js 客户端打印html 并且去掉页眉、页脚的实例
2017/11/03 Javascript
bootstrap自定义样式之bootstrap实现侧边导航栏功能
2018/09/10 Javascript
JavaScript的级联函数用法简单示例【链式调用】
2019/03/26 Javascript
小程序数据通信方法大全(推荐)
2019/04/15 Javascript
使用express来代理服务的方法
2019/06/21 Javascript
javascript 关于赋值、浅拷贝、深拷贝的个人理解
2019/11/01 Javascript
JS浏览器BOM常见操作实例详解
2020/04/27 Javascript
django-rest-framework 自定义swagger过程详解
2019/07/18 Python
Jupyter Notebook输出矢量图实例
2020/04/14 Python
Python导入父文件夹中模块并读取当前文件夹内的资源
2020/11/19 Python
ShellScript面试题一则-ShellScript编程
2014/03/05 面试题
网络工程与软件技术毕业生自荐信
2013/09/24 职场文书
建筑行业的大学生自我评价
2013/12/08 职场文书
班会关于环保演讲稿
2013/12/29 职场文书
运动会800米加油稿
2014/02/22 职场文书
《爱如茉莉》教后反思
2014/04/12 职场文书
汉语言文学专业自荐信
2014/06/11 职场文书
2015新生加入学生会自荐书
2015/03/24 职场文书
比赛主持人开场白
2015/05/29 职场文书
铁人观后感
2015/06/16 职场文书
高中诗歌鉴赏教学反思
2016/02/16 职场文书
goland 清除所有的默认设置操作
2021/04/28 Golang
一文搞懂PHP中的抽象类和接口
2022/05/25 PHP