la
la
http://sentsin.com/jquery/la
老鸟可以略过……
公共部分引入的插件
<!-- 引入 jquery 和 layer 插件 -->
<script src="./js/jquery.min.js"></script>
<script src="./js/layer/layer.min.js"></script>列表页面 index.html 部分代码：<a class="btn btn-info btn-xs oprabtn moduser" modurl="{:U('user/edit',array('id'=>$vo['id']))}">修 改</a>
<script>
$('.moduser').on('click', function(){
var modurl = $(this).attr("modurl"); // 获取 要打开的链接地址
$.layer({
type: 2,
title: '编辑管理员',
maxmin: true,
shadeClose: false, //开启点击遮罩关闭层
area : ['800px', '460px'],
offset : ['100px', ''],
iframe: {src: modurl} // 弹出层 iframe 要打开的链接地址
});
});
</script>模板 edit.html 部分代码，至于怎么在 模板 中进行 jquery 前端验证，自己写吧 \^0^/<form class="form-horizontal" id="myform" action="{:U('user/updates')}" method="post">
<input type="hidden" name="id" value="{$id}" />
<div class="form-group">
<label class="col-sm-2 control-label">用户名</label>
<div class="col-sm-4">
<input type="text" class="form-control" name="user_login" value="{$user_login}" placeholder="请输入用户名" />
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<a class="btn btn-primary" id="ajaxform">提 交</a>
</div>
</div>
</form>
<script>
// ajax 提交表单
$(document).ready(function(){
$("#ajaxform").click(function(){ // 提交按钮触发事件
var tourl = $("#myform").attr("action"); // 获取 表单的 提交地址
// 序列化 表单数据 后提交 ，太简洁了
$.post(tourl,$("form").serialize(),function(data){
// data 是 ajaxreturn 返回的 数据
// layer 插件的方法，只一句话，够简单
layer.msg(data['info'], 2, 1); // 2秒后自动关闭，-1代表不显示图标
if(data['status'] == 1){
// 刷新弹出层
setTimeout("javascript:window.location.reload(__URL__)",2100);
}
});
});
});
</script>后台的自动验证也请自己写吧
最佳答案
