Ajax提交表单并接收json实例代码
需求:
实现点击按钮后,数据以表单形式提交至服务器,并接收来自服务器的返回数据。过程中页面不刷新。
html代码
<html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script> <script src="./testajaxjs.js"></script> <head> </head> <body> <form id="form1"> <p>xingming:<input type="text" name="xingming"/></p> <p>nianling:<input type="text" name="nianling"/></p> </form> <button type="button" id="mybt" onclick="mysubmmit()"> ajax提交 </button> </body> </html>
js代码
function mysubmmit(){ $.ajax({ type: "POST", url: "testajaxend.php", data: $('#form1').serialize(), async: false, success: function(databack){ //console.log("chenggong"); console.log(databack); }, error: function(request){ console.log("shibaile"); } }); }
后端php代码
<?php $name = $_POST['xingming']; $age = $_POST['nianling']; $myarray = array("name"=>$name, "age"=>$age); $myjson = json_encode($myarray); echo $myjson; ?>
原文链接:http://blog.csdn.net/sinat_27564919/article/details/73717680
(资源库 www.zyku.net)
您可能感兴趣的文章
- 04-01jQuery validate验证隐藏表单(hidden)域
- 03-30thinkphp5 使用H-ui+ajax 提交数据
- 07-27PHP自定义函数判断是否为Get、Post及Ajax提交的方法
- 07-27Mysql5.7中JSON操作函数使用说明
- 07-18使用Ajax方法实现Form表单的提交及注意事项
- 07-18Ajax的特性及乱码问题
- 07-12jQuery+Ajax请求本地数据加载商品列表页并跳转详情页
- 05-28配置iis支持.json格式的文件
- 05-28用JavaScrip正则表达式验证form表单的方法
- 05-21ThinkPHP下表单令牌错误与解决方法分析
- 10-15小米真无线降噪耳机3pro如何绑定手机
- 09-11苹果手机芒果tv如何取消自动续费服务
- 08-14苹果手机如何过滤未知发件人
- 03-02opporeno6启用视频通话美颜方法
- 03-10小米MIUI电池健康显示功能查看方法
- 11-21airpods如何更改名字
- 03-04wordpress把页面设置为首页之后分页失
- 07-29jquery v2.0.0
- 04-07华为mate40e长图截屏步骤操作方法
- 02-18MongoDB运行日志实现自动分割的方法实
最近更新
阅读排行
猜你喜欢
- 10-30oppo手机怎样开启一键锁屏
- 06-15HTML+CSS布局图标文字混排
- 01-12遇见我的猫-遇见我的猫应用软件功能介
- 03-09VIVO手机设置微信应用锁方法
- 10-12realmegtneo2如何启用定时开关机
- 10-12帝国网站管理系统之网站迁移教程
- 11-02帝国CMS教程:统计文章数量、会员数量代
- 07-05Linux ext2ed命令
- 11-06苹果13pro还原网络设置方法介绍
- 07-05Linux csplit命令