使用laravel和创建交互式、快速动态网页应用的网页开发技术实现整个页面无刷新的操作方法

1、数据库文件

如果不存在，则创建表键' id '，project _ id int(11)NOT NULL COMMENT '外键项目' id '，名称varchar(100)非空注释'键名，结构枚举("字符串"、"哈希"、"列表"、"集合"、" zset")COmment "数据结构ttl varchar(50)非空注释'过期时间，用户varchar(20)非空注释'使用者，原因瓦尔查尔(255)非空注释'使用原因，created _ time int(11)NOT NULL COMMENT '创建时间，删除整数(2)不为空默认值"0"注释是否删除(0=不删除，1=删除)')ENGINE=innodb DEFAULT CHARSET=utf8 COMMENT='键表；2、首页的内容

@ include('布局。nav ')@ include('布局。slide ')div class=' contain ' style=' width : 84%；'id=' contain ' div style=' width :30%；边距-底部' :20 px'select class=' form-control ' id=' project '选项值='0 '请选择城市/option @ foreach($ project as $ project)选项值=' { $ project-id } } ' @如果({ $ project-id } } '=' { $ project _ id } } ')选中='选中' @ endif { { $ project-name } }/option @ endforeach/select/div table class=' table-hover ' the and tr thid/th键名/th数据结构/th过期时间/th使用者/th使用原因/th操作/th/tr/ad t body @ foreach($ key as $ key)tr TD { { $ key-id } }/TD { { $ key-name } }/TD { { $ key-structure } }/TD { { date(' Y-m-d h 3360 I 3360s '，($ key-TTL $ key-created _ time))}/TD { { $ key-user } }/TD { { $ key-reason } }/TD TD TD修改删除/TD/tr @ endforeach/t body div style=' position : absolute； top :450 px ' right :120 px ' { $ keys-render()} } div style=' float : right；字母间距2px边距-左侧：10像素；class='pagi__count '共{{ $count }}条数据/div/表格/div效果：

3、使用ajax:给选择框加上变化事件，触发时，到按键控制器下的klist方法，并传入项目id，在klist方法中进行处理，获取数据传出来，将整个页面的身体的内容全都改变。

脚本类型='text/javascript' $('#project ').change(function() { $).帖子(' { { URL(' key/klist ')} }/' $(' # project ').val()，//路由为route :3360 ANy('/key/klist/{ project _ id } '){ ' _ token ' : ' { csrf _ token()} } ' } ')，函数（数据){ $('#body ').html(数据);});});/script4、klist的方法：判断传入的项目编号为0的话，就获取全部数据，不为0,则获取外键==项目_id的键的值，将整个页面都传出去

公共函数klist($ project _ id){ if($ project _ id==0){ $ project=project : all()；$ keys=key :3360 order by(' created _ time '，' desc ')-paginate(8)；$ count=key :3360 count()；$ project _ id=0；返回视图(' key.index '，compact('project_id '，' projects '，' key '，' count ')；} $ project=project :3360 all()；$ keys=project : find($ project _ id)-key()-paginate(8)；$ count=project : find($ project _ id)-key-count()；返回视图(' key.index '，compact('project_id '，' projects '，' key '，' count ')；}5、实现：当下拉框改变时，内容改变并未刷新

以上这篇使用laravel和创建交互式、快速动态网页应用的网页开发技术实现整个页面无刷新的操作方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。