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 相关文章推荐
用cookies来跟踪识别用户
Oct 09 PHP
PHP版自动生成文章摘要
Jul 23 PHP
php 操作excel文件的方法小结
Dec 31 PHP
php 正确解码javascript中通过escape编码后的字符
Jan 28 PHP
使用JSON实现数据的跨域传输的php代码
Dec 20 PHP
php curl请求信息和返回信息设置代码实例
Apr 27 PHP
PHP基于curl post实现发送url及相关中文乱码问题解决方法
Nov 25 PHP
php5.5使用PHPMailer-5.2发送邮件的完整步骤
Oct 14 PHP
实例分析PHP将字符串转换成数字的方法
Jan 27 PHP
ThinkPHP框架下微信支付功能总结踩坑笔记
Apr 10 PHP
Thinkphp整合阿里云OSS图片上传实例代码
Apr 28 PHP
详解提高使用Java反射的效率方法
Apr 29 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数据库的增删改查 php与javascript之间的交互
2017/08/31 PHP
Google (Local) Search API的简单使用介绍
2013/11/28 Javascript
js style动态设置table高度
2014/10/21 Javascript
jQuery+canvas实现简单的球体斜抛及颜色动态变换效果
2016/01/28 Javascript
JS解决iframe之间通信和自适应高度的问题
2016/08/24 Javascript
探索Vue.js component内容实现
2016/11/03 Javascript
使用纯JS代码判断字符串中有多少汉字的实现方法(超简单实用)
2016/11/12 Javascript
Angular的$http与$location
2016/12/26 Javascript
JavaScript html5 canvas实现图片上画超链接
2017/10/20 Javascript
Vue精简版风格概述
2018/01/30 Javascript
webpack配置打包后图片路径出错的解决
2018/04/26 Javascript
js循环map 获取所有的key和value的实现代码(json)
2018/05/09 Javascript
JS删除对象中某一属性案例详解
2020/09/08 Javascript
antd-DatePicker组件获取时间值,及相关设置方式
2020/10/27 Javascript
python 解析XML python模块xml.dom解析xml实例代码
2014/02/07 Python
Python中的yield浅析
2014/06/16 Python
python中数据爬虫requests库使用方法详解
2018/02/11 Python
numpy.transpose对三维数组的转置方法
2018/04/17 Python
使用Django简单编写一个XSS平台的方法步骤
2019/03/25 Python
python GUI库图形界面开发之PyQt5时间控件QTimer详细使用方法与实例
2020/02/26 Python
pytorch 限制GPU使用效率详解(计算效率)
2020/06/27 Python
python如何实现图片压缩
2020/09/11 Python
python基于exchange函数发送邮件过程详解
2020/11/06 Python
css3实现文字首尾衔接跑马灯的示例代码
2020/10/16 HTML / CSS
意大利会呼吸的鞋:Geox健乐士
2017/02/12 全球购物
JACK & JONES荷兰官网:男士服装和鞋子
2021/03/07 全球购物
屈臣氏俄罗斯在线商店:Watsons俄罗斯
2020/08/03 全球购物
计算机应用专业推荐信
2013/11/13 职场文书
大学生工作推荐信范文
2013/12/02 职场文书
舞蹈比赛获奖感言
2014/02/04 职场文书
2015年评职称工作总结范文
2015/04/20 职场文书
开除通知书范本
2015/04/25 职场文书
鸦片战争观后感
2015/06/09 职场文书
教你漂亮打印Pandas DataFrames和Series
2021/05/29 Python
Python爬虫框架之Scrapy中Spider的用法
2021/06/28 Python
关于Python中进度条的六个实用技巧分享
2022/04/05 Python