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技巧
Dec 06 Javascript
使用SyntaxHighlighter实现HTML高亮显示代码的方法
Feb 04 Javascript
js改变鼠标的形状和样式的方法
Mar 31 Javascript
Bootstrap三种表单布局的使用方法
Jun 21 Javascript
微信公众号开发 自定义菜单跳转页面并获取用户信息实例详解
Dec 08 Javascript
微信小程序 下拉菜单简单实例
Apr 13 Javascript
详解webpack性能优化——DLL
Oct 20 Javascript
详解vue表单——小白速看
Apr 08 Javascript
详解浏览器缓存和webpack缓存配置
Jul 06 Javascript
jQuery实现的别踩白块小游戏完整示例
Jan 07 jQuery
解决layer.open弹出框不能获取input框的值为空的问题
Sep 10 Javascript
构建大型 Vue.js 项目的10条建议(小结)
Nov 14 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
制作美丽的拉花
2021/03/03 冲泡冲煮
PHP实现带进度条的Ajax文件上传功能示例
2019/07/02 PHP
input 输入框获得/失去焦点时隐藏/显示文字(jquery版)
2013/04/02 Javascript
jQuery实现公告文字左右滚动的实例代码
2013/10/29 Javascript
JavaScript实现防止网页被嵌入Frame框架的代码分享
2014/12/29 Javascript
AngularJS语法详解(续)
2015/01/23 Javascript
优化RequireJS项目的相关技巧总结
2015/07/01 Javascript
javascript基于prototype实现类似OOP继承的方法
2015/12/16 Javascript
js遍历map javaScript遍历map的简单实现
2016/08/26 Javascript
jQuery EasyUI编辑DataGrid用combobox实现多级联动
2016/08/29 Javascript
jquery实现tab选项卡切换效果(悬停、下方横线动画位移)
2017/05/05 jQuery
JavaScript中splice与slice的区别
2017/05/09 Javascript
jQuery插件imgAreaSelect基础讲解
2017/05/26 jQuery
jQuery实现简单的手风琴效果
2020/04/17 jQuery
ES6中字符串string常用的新增方法小结
2017/11/07 Javascript
详解angularjs跨页面传参遇到的一些问题
2018/11/01 Javascript
Vue 框架之动态绑定 css 样式实例分析
2018/11/14 Javascript
解决vue.js提交数组时出现数组下标的问题
2019/11/05 Javascript
[01:32]dota2拉比克至宝(222)
2018/12/20 DOTA
简单文件操作python 修改文件指定行的方法
2013/05/15 Python
Python科学计算环境推荐——Anaconda
2014/06/30 Python
基于Linux系统中python matplotlib画图的中文显示问题的解决方法
2017/06/15 Python
浅谈python中列表、字符串、字典的常用操作
2017/09/19 Python
Python3.5字符串常用操作实例详解
2019/05/01 Python
使用pytorch实现论文中的unet网络
2020/06/24 Python
python 根据列表批量下载网易云音乐的免费音乐
2020/12/03 Python
PyCharm 解决找不到新打开项目的窗口问题
2021/01/15 Python
python网络爬虫实现发送短信验证码的方法
2021/02/25 Python
Linux如何为某个操作添加别名
2015/02/05 面试题
党支部书记岗位职责
2015/02/15 职场文书
乡镇团代会开幕词
2016/03/04 职场文书
经销商会议开幕词
2016/03/04 职场文书
2016年学校“3.12”植树节活动总结
2016/03/16 职场文书
导游词之四川熊猫基地
2020/01/13 职场文书
详解JSON.parse和JSON.stringify用法
2022/02/18 Javascript
关于MySQL临时表为什么可以重名的问题
2022/03/22 MySQL