Ajax提交表单并接收json实例代码

发布时间 - 2026-01-11 02:02:55    点击率:

需求:

实现点击按钮后,数据以表单形式提交至服务器,并接收来自服务器的返回数据。过程中页面不刷新。

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;
?>

以上所述是小编给大家介绍的Ajax提交表单并接收json实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!


# ajax  # 提交表单  # 接收json  # 原生JS封装ajax 传json  # str  # excel文件上传提交表单(推荐)  # 使用Ajax、json实现京东购物车结算界面的数据交互实例  # AJAX跨域请求JSONP获取JSON数据的实例代码  # PHP封装返回Ajax字符串和JSON数组的方法  # ajax响应json字符串和json数组的实例(详解)  # 表单  # 小编  # 在此  # 给大家  # 所述  # 给我留言  # 感谢大家  # 过程中  # 后端  # 疑问请  # 有任何  # script  # src  # Type  # https  # text  # content  # UTF  # charset  # cdn 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: Laravel如何发送邮件和通知_Laravel邮件与通知系统发送步骤  Laravel怎么定时执行任务_Laravel任务调度器Schedule配置与Cron设置【教程】  Win11怎么关闭资讯和兴趣_Windows11任务栏设置隐藏小组件  Laravel怎么实现验证码(Captcha)功能  Laravel如何从数据库删除数据_Laravel destroy和delete方法区别  网站建设整体流程解析,建站其实很容易!  Laravel怎么在Blade中安全地输出原始HTML内容  Laravel如何实现用户密码重置功能?(完整流程代码)  Android利用动画实现背景逐渐变暗  北京网站制作的公司有哪些,北京白云观官方网站?  如何为不同团队 ID 动态生成多个“认领值班”按钮  Laravel观察者模式如何使用_Laravel Model Observer配置  Laravel策略(Policy)如何控制权限_Laravel Gates与Policies实现用户授权  Laravel如何实现多级无限分类_Laravel递归模型关联与树状数据输出【方法】  Laravel Eloquent:优雅地将关联模型字段扁平化到主模型中  如何在浏览器中启用Flash_2025年继续使用Flash Player的方法【过时】  动图在线制作网站有哪些,滑动动图图集怎么做?  Win11搜索不到蓝牙耳机怎么办 Win11蓝牙驱动更新修复【详解】  如何在建站宝盒中设置产品搜索功能?  详解Nginx + Tomcat 反向代理 负载均衡 集群 部署指南  Win11怎么设置默认图片查看器_Windows11照片应用关联设置  郑州企业网站制作公司,郑州招聘网站有哪些?  太平洋网站制作公司,网络用语太平洋是什么意思?  Laravel Vite是做什么的_Laravel前端资源打包工具Vite配置与使用  Laravel怎么实现前端Toast弹窗提示_Laravel Session闪存数据Flash传递给前端【方法】  如何快速搭建FTP站点实现文件共享?  Laravel如何实现多对多模型关联?(Eloquent教程)  简单实现jsp分页  如何用VPS主机快速搭建个人网站?  如何用花生壳三步快速搭建专属网站?  制作无缝贴图网站有哪些,3dmax无缝贴图怎么调?  如何用手机制作网站和网页,手机移动端的网站能制作成中英双语的吗?  长沙做网站要多少钱,长沙国安网络怎么样?  如何自己制作一个网站链接,如何制作一个企业网站,建设网站的基本步骤有哪些?  ,在苏州找工作,上哪个网站比较好?  东莞市网站制作公司有哪些,东莞找工作用什么网站好?  如何在Windows虚拟主机上快速搭建网站?  Laravel怎么创建自己的包(Package)_Laravel扩展包开发入门到发布  HTML5段落标签p和br怎么选_文本排版常用标签对比【解答】  晋江文学城电脑版官网 晋江文学城网页版直接进入  品牌网站制作公司有哪些,买正品品牌一般去哪个网站买?  Laravel怎么实现软删除SoftDeletes_Laravel模型回收站功能与数据恢复【步骤】  悟空浏览器如何设置小说背景色_悟空浏览器背景色设置【方法】  英语简历制作免费网站推荐,如何将简历翻译成英文?  如何在服务器上配置二级域名建站?  如何获取免费开源的自助建站系统源码?  制作旅游网站html,怎样注册旅游网站?  Laravel如何处理JSON字段的查询和更新_Laravel JSON列操作与查询技巧  如何在香港服务器上快速搭建免备案网站?  Python正则表达式进阶教程_复杂匹配与分组替换解析