Bootstrap+angulerjs实现异步登陆
管理员 发布于 6年前 410
html:
<body style="background:#fff;" ng-app="Ajax" ng-controller="Ajax">
<form>
<div class="form-group" style="margin-bottom: 5px;">
<label for="inputEmail3" class="col-sm-2 control-label">Email</label>
<div class="col-sm-10">
<input type="email" ng-model="email" class="form-control" id="inputEmail3" />
<span id="check_user" style="font-size: 8px;color: red;display: none;"></span>
</div>
</div>
<div class="form-group" style="margin-bottom: 0px;">
<label for="inputPassword3" class="col-sm-2 control-label">Pass</label>
<div class="col-sm-10">
<input type="password" ng-model="password" class="form-control" id="inputPassword3" />
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<div class="checkbox">
<label><input type="checkbox" />Remember me</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" ng-click="get_more();" class="btn btn-primary btn-large">Sign in</button>
</div>
</div>
</form>
js:
<script type="text/javascript">
var myModule = angular.module("Ajax",[]);
myModule.controller("Ajax",["$scope","$http",function Ajax($scope,$http){
$scope.get_more = function(){
$http({
method: "POST",
url: "login",
data:{'username':$scope.username,
'email':$scope.email,
'password':$scope.password
}
}).
success(function(data, status) {
//$scope.status = status;
$scope.users = data;
if (data.error == 1) {
alert(data.info);
location.reload();
}else{
$("#check_user").html(data.info);
$("#check_user").css("display","block");
};
}).
error(function(data, status) {
//$scope.data = data || "Request failed";
//$scope.status = status;
});
}
}]);
</script>
效果：（用file_get_contents("php://input")获取参数，在json_decode转）
{ email: "11", password: "1"}请勿发布不友善或者负能量的内容。与人为善，比聪明更重要！
该博客于2020-12-7日，后端基于go语言的beego框架开发
前端页面使用Bootstrap可视化布局系统自动生成
是我仿的原来我的TP5框架写的博客，比较粗糙，底下是入口
侯体宗的博客
文章标签
- test 三种扣减库存方案 Hyperf2.1启动报错端口占用 上外网神器Ghelper 上外网神器集装箱 laravel中HMVC模式 Hyperf框架验证器 Hyperf自定义函数编写 Hyperf对象转成数组 PHP2021面试题集 centos7系统上挂载 Hyperf框架 秒杀系统的设计 Laravel Octane PHP数组底层实现原理 php7垃圾回收机制 Laravel中类型转换 mysql事务特征及隔离级别 Linux-awk命令 mysql编码 JWT源码实现 Laravel内核分析 Laravel中的用法 centos7+go环境+beego框架 go+beego框架开发博客 go+beego开发博客首页 go+beego自定义公共函数 beego注册_登录_查询 beego控制器创建 Beego框架安装 go语言环境安装 laravel+Elasticsearc laravel运行原理 windows7搭建Vuejs环境 Laravel分块 laravel去重(distinct() laravel集合 laravel+mysql读写分离 laravel5+复杂原生sql laravel+MissMyCat/al lnmp sessio laravel自定义数组分页 laravel中.env配置 laravel8队列发邮件 码云仓库常用操作 laravel8配置163SMTP laravel8配置全局函数 laravel/jetstream之认证 laravel/jetstream
友情链接
