post方式提交数据
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>
我的第一个ajax
</title>
<link href="css/style.css" rel="stylesheet"/>
<link href="css/bootstrap.min.css" rel="stylesheet"/>
<script src="js/jquery-1.9.1.min.js"></script>
</head>
<body>
<div id="box" style="border:1px solid red;display: block;clear: both; width: 500px; height: 40px; margin:20px auto;">
</div>
<form id="form">
<div class="form-group">
<label>姓名：</label>
<input type="text" class="form-control " placeholder="姓名" name="user" >
</div>
<div class="form-group">
<label>价格：</label>
<input type="text" class="form-control" placeholder="价格" name="price" >
</div>
<div class="form-group">
<label>描述：</label>
<textarea class="form-control" rows="3" name="description"></textarea>
</div>
<div class="form-group">
<label>上传图片：</label>
<input type="file" name="img">
</div>
<center>
<button type="button" class="btn btn-default" name="submit">
提交
</button>
</center>
<div class="submit">
<span class="loading">正在提交...</span>
</div>
</form>
<script>
$(function() {
$('form button[type=button]').click(function() {
$.ajax({
type: "POST",
url: "formtest.php",
// 表单序列化
data: $('form').serialize(),
success: function(response, status, xhr) {
$('#box').html(response);
},
error: function(xhr, errorText, erroType) {
//alert('错误');
//alert(errorText+":"+erroType);
alert(xhr.status + ":" + xhr.statusText);
}
});
}); // $('form button[type=button]').click(function() {
// $.ajax({
// type: "POST",
// url: "formtest.php",
// //param() 方法用于在内部将元素值转换为序列化的字符串表示
// data:$.param({
// user:$('form input[name=user]').val(),
// price:$('form input[name=price]').val(),
// description:$('form textarea[name=description]').val()
// }),
// success: function(response, status, xhr) {
// $('#box').html(response);
// },
// error: function(xhr,errorText,erroType) {
// //alert('错误');
// //alert(errorText+":"+erroType);
// alert(xhr.status+":"+xhr.statusText);
// }
// });
// });
$(document).ajaxStart(function() {
$('.loading').show();
}).ajaxStop(function() {
$('.loading').hide();
});
})
</script>
</body>
</html>
formtest.php
<?php
echo $_POST['user']."-".$_POST['price']."-".$_POST['description'];
?>
post方式提交数据的更多相关文章
- Android 采用post方式提交数据到服务器
接着上篇<Android 采用get方式提交数据到服务器>,本文来实现采用post方式提交数据到服务器 首先对比一下get方式和post方式: 修改布局: <LinearLayout ...
- Android（java）学习笔记213：开源框架post和get方式提交数据（qq登录案例）
1.前面提到Http的get/post方式 . HttpClient方式,实际工作的时候不常用到,因为这些方式编写代码是很麻烦的 2.Android应用会经常使用http协议进行传输,网上会有很完善 ...
- Android 使用Post方式提交数据（登录）
在Android中,提供了标准Java接口HttpURLConnection和Apache接口HttpClient,为客户端HTTP编程提供了丰富的支持. 在HTTP通信中使用最多的就是GET和POS ...
- Android 使用Post方式提交数据
在Android中,提供了标准Java接口HttpURLConnection和Apache接口HttpClient,为客户端HTTP编程提供了丰富的支持. 在HTTP通信中使用最多的就是GET和POS ...
- 苹果微信浏览器不能post方式提交数据问题
form表单中采用post方式提交数据时,在苹果的微信浏览器中无法传递,安卓的可以 如图: 在controller中获取该数据为 null 将表单的提交方式修改为get就能够获取到 现在采用Ajax方 ...
- Android（java）学习笔记156：开源框架post和get方式提交数据（qq登录案例）
1. 前面提到Http的get/post方式 . HttpClient方式,实际工作的时候不常用到,因为这些方式编写代码是很麻烦的 2. Android应用会经常使用http协议进行传输,网上会有很 ...
- postman 中post方式提交数据
post方式提交数据时,把参数填写在body中而不是pOST下面的哪一行
- Android 采用get方式提交数据到服务器
首先搭建模拟web 服务器,新建动态web项目,servlet代码如下: package com.wuyudong.web; import java.io.IOException; import ja ...
- JQuery以JSON方式提交数据到服务端
JQuery将Ajax数据请求进行了封装,从而使得该操作实现起来容易许多.以往我们要写很多的代码来实现该功能,现在只需要调用$.ajax()方法,并指明请求的方式.地址.数据类型,以及回调方法等.下面 ...
- easyui form 方式提交数据
http://ldzyz007.iteye.com/blog/2067540 <form id="ff" method="post"> . ...
随机推荐
- 不作死就不会死，微软强行插入NO-IP
微软啊微软,你这是何苦来着. 事情经过大致是这样的,微软向美国法院提出起诉No-IP名下22个常用的子域名被恶意软件的作者滥用,要求法官裁定由微软接管No-IP名下的这22个子域名,以便其可以过滤恶意 ...
- Push rejected: Push master to origin/master was rejected /failed to push some refs to /git did not exit cleanly
用studio提交代码报 Push rejected: Push master to origin/master was rejected 用TortiuseGit提交代码报下面错,(我是用这种方法解 ...
- 层叠样式表css的优先级
优先级1:外部<内部<行内优先级2:标签选择器<类选择器<ID选择器
- Java bean中布尔类型使用注意
JavaBean是一个标准,遵循标准的Bean是一个带有属性和getters/setters方法的Java类. JavaBean的定义很简单,但是还有有一些地方需要注意,例如Bean中含有boolea ...
- css笔记 - 张鑫旭css课程笔记之 z-index 篇
一.z-index语法.支持的属性值等 z-index: 在支持z-index的元素上, z-index规定了元素(包括子元素)的垂直z方向的层级顺序, z-index可以决定哪个元素覆盖在哪个元素上 ...
- H5 password自动记录取消
最近完成一个项目时需要取消谷歌浏览器的密码自动填充功能,为了用户方便,大多浏览器都有保存某个网站的密码并在后面再打开这个网站且需要输入密码的时候自动填充.这个功能是方便,但是我们有时候不需要使用这个功 ...
- spy-debugger 前端调试工具
一站式页面调试.抓包工具.远程调试任何手机浏览器页面,任何手机移动端webview(如:微信,HybirdApp等).支持HTTP/HTTPS,无需USB连接设备. Language: Engl ...
- 关于ASP.NET和.NET的区别和联系
对于一个新手,往往会被这些名字给搞蒙了,对不起(笨小孩我也被搞蒙过,见笑啦),这归根结底还是怪自己对知识掌握和了解的不够,废话不多,直接到主题. ASP.NET和.NET的区别和联系 .NET 一般所 ...
- C#生成随机验证码例子
C#生成随机验证码例子: 前端: <tr> <td width=" align="center" valign="top"> ...
- 视频播放效果--video.js播放mp4文件
HTML5的标签 video 支持的mp4编码为视频编码 H.264 音频AAC 参考网址 http://www.w3school.com.cn/html5/html_5_video.asp 视频格式 ...