本文实例讲述了TP5(thinkPHP5)框架使用ajax实现与后台数据交互的方法。分享给大家供大家参考,具体如下:
方法一: serialize() 方法通过序列化表单值,创建 URL 编码文本字符串,这个是jquery提供的方法
前端代码
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事件监听
前端代码
管理员登录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);
}
希望本文所述对大家基于ThinkPHP框架的PHP程序设计有所帮助。