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 相关文章推荐
在 PHP 中使用随机数的三个步骤
Oct 09 PHP
fleaphp crud操作之findByField函数的使用方法
Apr 23 PHP
php ajax 静态分页过程形式
Sep 02 PHP
php中判断字符串是否全是中文或含有中文的实现代码
Sep 16 PHP
php将gd生成的图片缓存到memcache的小例子
Jun 05 PHP
PHP处理postfix邮件内容的方法
Jun 16 PHP
php使用MySQL保存session会话的方法
Jun 18 PHP
谈谈 PHP7新增功能
Dec 16 PHP
PHP + plupload.js实现多图上传并显示进度条加删除实例代码
Mar 06 PHP
基于 Swoole 的微信扫码登录功能实现代码
Jan 15 PHP
php设计模式之适配器模式原理、用法及注意事项详解
Sep 24 PHP
浅析PHP反序列化中过滤函数使用不当导致的对象注入问题
Feb 15 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
《星际争霸II》全新指挥官斯台特曼现已上线
2020/03/08 星际争霸
在MongoDB中模拟Auto Increment的php代码
2011/03/06 PHP
深入PHP变量存储的详解
2013/06/13 PHP
PHP实现十进制数字与二十六进制字母串相互转换操作示例
2018/08/10 PHP
jQuery 隔行换色 支持键盘上下键,按Enter选定值
2009/08/02 Javascript
兼容IE和FF的图片上传前预览js代码
2013/05/28 Javascript
JS图片根据鼠标滚动延时加载的实例代码
2013/07/13 Javascript
js中return false(阻止)的用法
2013/08/14 Javascript
《JavaScript DOM 编程艺术》读书笔记之JavaScript 图片库
2015/01/09 Javascript
深入探讨javascript中的数据类型
2015/03/04 Javascript
JavaScript中判断数据类型的方法总结
2016/05/24 Javascript
用JS中split方法实现彩色文字背景效果实例
2016/08/24 Javascript
判断横屏竖屏(三种)
2017/02/13 Javascript
vue项目base64字符串转图片的实现代码
2018/07/13 Javascript
使用VUE+iView+.Net Core上传图片的方法示例
2019/01/04 Javascript
vue用BMap百度地图实现即时搜索功能
2019/09/26 Javascript
vue项目中定义全局变量、函数的几种方法
2019/11/08 Javascript
JavaScript代理模式原理与用法实例详解
2020/03/10 Javascript
解决VUE自定义拖拽指令时 onmouseup 与 click事件冲突问题
2020/07/24 Javascript
Python 2.7.x 和 3.x 版本的重要区别小结
2014/11/28 Python
python openpyxl使用方法详解
2019/07/18 Python
Django使用模板后无法找到静态资源文件问题解决
2019/07/19 Python
在Python3 numpy中mean和average的区别详解
2019/08/24 Python
浅谈PyQt5中异步刷新UI和Python多线程总结
2019/12/13 Python
Python requests模块基础使用方法实例及高级应用(自动登陆,抓取网页源码)实例详解
2020/02/14 Python
python多进程下的生产者和消费者模型
2020/05/07 Python
python语言是免费还是收费的?
2020/06/15 Python
python性能测试工具locust的使用
2020/12/28 Python
小狗电器官方商城:中国高端吸尘器品牌
2017/03/29 全球购物
房地产出纳岗位职责
2013/12/01 职场文书
交通安全教育制度
2014/02/02 职场文书
优秀团支部事迹材料
2014/02/08 职场文书
求职者怎样写自荐信
2014/04/13 职场文书
二年级上册数学教学计划
2015/01/20 职场文书
搞笑婚礼主持词开场白
2015/11/24 职场文书
如何用PHP实现分布算法之一致性哈希算法
2021/05/26 PHP