怎么在thinkPHP5中使用ajax实现与后台数据交互

发布时间：2021-03-20 17:20:01

来源：亿速云

阅读：87

作者：Leah

这篇文章给大家介绍怎么在thinkPHP5中使用ajax实现与后台数据交互，内容非常详细，感兴趣的小伙伴们可以参考借鉴，希望对大家能有所帮助。

方法一： serialize() 方法通过序列化表单值，创建 URL 编码文本字符串,这个是jquery提供的方法

前端代码html>

ajax交互

$('.but').click(function () {

var formData = $("#myform").serialize();//formData值：account=sdf&passwd=sdf

//serialize() 方法通过序列化表单值，创建 URL 编码文本字符串,这个是jquery提供的方法

$.ajax({

type: "post",

url: "{:url('index/index/reg')}", //数据传输的控制器方法

data: formData,//这里data传递过去的是序列化以后的字符串

success: function (data) {

console.log(data);

$("#content").append(data);//获取成功以后输出返回值

}

});

return false;

})

后端代码public function reg($account,$passwd){

if($account == '123'){

return json("ajax成功！".$account."---".$passwd);

}else{

return json("你输出的是其他值：".$account."---".$passwd);

}

}

方法二： 利用layui的form.on事件监听

前端代码html>

管理员登录

content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">

layui.extend({

admin: '{/}./static/js/admin'

});

//layui.use调用模块

layui.use(['form', 'admin'], function () {

//获得form模块

var form = layui.form

, admin = layui.admin;

//监听提交

//事件监听

//语法：form.on('event(过滤器值)', callback);(过滤器值指lay-filter="过滤器值")

//function(data)里的data是一个object，data.field是表单填写的内容

form.on('submit(login)', function (data) {

//$.post写法：$(selector).post(URL,data,function(data,status,xhr),dataType)

var post_data = data.field;

$.post("{:url('verify')}"

, post_data

, function (data) {

console.log(data);

}

)

return false;

});

})

;

后端代码public function verify()

{

$posts = input("post.password");

return json($posts);

}

关于怎么在thinkPHP5中使用ajax实现与后台数据交互就分享到这里了，希望以上内容可以对大家有一定的帮助，可以学到更多知识。如果觉得文章不错，可以把它分享出去让更多的人看到。