Ajax请求PHP后台接口返回信息的实例代码


Posted in PHP onAugust 21, 2018

前台就是一个表单,这里是用的bootstrop的

<form method="post" >
 <!-- token验证 -->
 <!--{{ csrf_field() }}-->
 <div class="form-group" style="width:30%">
  <label for="exampleInputPassword1">昵称</label>
  <input type="name" id="nickname" name="nickname" class="form-control" id="exampleInputname1" placeholder="用于评论昵称">
 </div>
 <div class="form-group">
  <label for="exampleInputEmail1">Email </label>
  <input style="width:30%" type="email" id="email" name="email" class="form-control" id="exampleInputEmail1" placeholder="用于接收回复消息通知">
  <span id="error_massage"></span>
 </div>
 <div class="form-group" style="width:60%;">
  <label for="name">留言内容</label>
  <textarea class="form-control" id="content" name="text" rows="3" placeholder="评论内容"></textarea>
  </div>
  <button type="submit" class="btn btn-default">Submit</button>
 </form>

php只简单验证了一个邮箱

public function postMassage(Request $Request)
 {  
   $email  = $Request->email;
   $messages = $this->article_messages->where('email',$email)->first();
   if (!empty($messages)) {
   return response()->json(['status' => 'ok','code' => 400,'message' => '该邮箱已存在!换一个吧!',]);
   }
 }

ajax的请求POst

<script type="text/javascript">
  $("form").submit(function(e){
    e.preventDefault();//阻止默认提交,表单不写method="post"这个可以不要
    console.log(11);
    var nickname = $('#nickname').val();
    var email = $('#email').val();
    var content = $('#content').val();
    $.ajax({
     type: "post",
     url: "/article/message",
     dataType:"json",
     data:{
     "nickname":nickname,
     "email":email,
     "content":content,
     "_token":"{{ csrf_token() }}",
     },
     success: function(data) {
      if (data.code == 400) {
       console.log(data);
       document.getElementById('error_massage').innerHTML =data.message;
      } else {

      }
     }
    });
    // $.post("/article/message", {
    //    "nickname":nickname,
    //     "email":email,
    //     "content":content,
    //     "_token":"{{ csrf_token() }}",
    // },
    // function(data){
    //  console.log(data);
    // });
   })

  </script>

最终:

Ajax请求PHP后台接口返回信息的实例代码

以上这篇Ajax请求PHP后台接口返回信息的实例代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
40个迹象表明你还是PHP菜鸟
Sep 29 PHP
PHP 简单日历实现代码
Oct 28 PHP
DedeCMS 核心类TypeLink.class.php摘要笔记
Apr 07 PHP
PHP学习笔记(二) 了解PHP的基本语法以及目录结构
Aug 04 PHP
PHP实现一维数组转二维数组的方法
Feb 25 PHP
smarty模板判断数组为空的方法
Jun 10 PHP
PHP数组的定义、初始化和数组元素的显示实现代码
Nov 05 PHP
php正则提取html图片(img)src地址与任意属性的方法
Feb 08 PHP
php json转换相关知识(小结)
Dec 21 PHP
laravel5.6框架操作数据curd写法(查询构建器)实例分析
Jan 26 PHP
解决PHP Opcache 缓存刷新、代码重载出现无法更新代码的问题
Aug 24 PHP
PHP生成随机密码4种方法及性能对比
Dec 11 PHP
php从数据库读取数据,并以json格式返回数据的方法
Aug 21 #PHP
php从数据库中获取数据用ajax传送到前台的方法
Aug 20 #PHP
PHP常见数组排序方法小结
Aug 20 #PHP
php 提交表单 关闭layer弹窗iframe的实例讲解
Aug 20 #PHP
PHP数组常用函数实例小结
Aug 20 #PHP
PHP预定义超全局数组变量小结
Aug 20 #PHP
Yii2语言国际化的配置教程
Aug 19 #PHP
You might like
PHP闭包(Closure)使用详解
2013/05/02 PHP
ThinkPHP实现递归无级分类――代码少
2015/07/29 PHP
PHP5.3新特性小结
2016/02/14 PHP
php mysql操作mysql_connect连接数据库实例详解
2016/12/26 PHP
IE和Mozilla的兼容性汇总event
2007/08/12 Javascript
JavaScript基本概念初级讲解论坛贴的学习记录
2009/02/22 Javascript
学习从实践开始之jQuery插件开发 菜单插件开发
2012/05/03 Javascript
jquery交替变换颜色的三种方法 实例代码
2013/11/19 Javascript
原生js实现水平方向无缝滚动
2017/01/10 Javascript
JavaScript使用原型和原型链实现对象继承的方法详解
2017/04/05 Javascript
jQuery实现的简单前端搜索功能示例
2017/10/28 jQuery
Vue+Jwt+SpringBoot+Ldap完成登录认证的示例代码
2018/05/21 Javascript
详解vue2.6插槽更新v-slot用法总结
2019/03/09 Javascript
vue 中 命名视图的用法实例详解
2019/08/14 Javascript
js 计算月/周的第一天和最后一天代码
2020/02/01 Javascript
JavaScript闭包原理与用法学习笔记
2020/05/29 Javascript
[02:32]DOTA2英雄基础教程 祸乱之源
2013/12/23 DOTA
[01:02]DOTA2辉夜杯决赛日 CDEC.Y对阵VG赛前花絮
2015/12/27 DOTA
Python 机器学习库 NumPy入门教程
2018/04/19 Python
python操作mysql代码总结
2018/06/01 Python
使用django-guardian实现django-admin的行级权限控制的方法
2018/10/30 Python
学习python可以干什么
2019/02/26 Python
基于python二叉树的构造和打印例子
2019/08/09 Python
Python全栈之列表数据类型详解
2019/10/01 Python
Python run()函数和start()函数的比较和差别介绍
2020/05/03 Python
CSS3控制HTML元素动画效果
2014/02/08 HTML / CSS
Shopee印度尼西亚:东南亚与台湾市场最大电商平台
2018/06/17 全球购物
在印度上传处方,在线订购药品:Medlife
2019/03/28 全球购物
新加坡鲜花速递/新加坡网上花店:Ferns N Petals
2020/08/29 全球购物
《李时珍夜宿古寺》教学反思
2014/04/09 职场文书
校园标语大全
2014/06/19 职场文书
单位委托书
2014/10/15 职场文书
学校党的群众路线教育实践活动个人整改方案
2014/10/31 职场文书
街道社区活动报告
2015/02/05 职场文书
毕业生求职自荐信(2016最新版)
2016/01/28 职场文书
创业计划书之电动车企业
2019/10/11 职场文书