![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Ajax案例
学习案例
Zhangzilnn
这个作者很懒,什么都没留下…
展开
-
Ajax——基于bootstrap的评论发布案例
1.渲染页面UI结构导入bootstrap.css + jquery.js插件:bootstrap 3 snippets1.1添加图书的Panel面板.bs3-panel-primary: Panel主面板 <!-- 评论面板 --> <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="pan...原创 2022-03-01 16:48:10 · 322 阅读 · 0 评论 -
Ajax——新闻列表案例
导入:jquery.js + template-web.js1.获取新闻列表数据 // 获取新闻列表的函数 function getNewsList() { $.get('http://www.liulongbin.top:3006/api/news', function (res) { if (res.status !== 200) { return alert('获取新闻列表数据失败!') } for (var i = 0...原创 2022-03-01 19:44:58 · 559 阅读 · 0 评论 -
Ajax——聊天机器人案例
1.聊天界面UI布局导入:reset.css + main.css jquery.js + jquery-ui.js + jquery.mousewheel.js(鼠标滚轮滑动) scroll.js(侧边滚动条)(为了实现发送消息 滚动条滑到最下即初始化滚动条,需要调用resetui())1.1html布局<div class="wrap"> <!-- 头部 Header 区域 --> &l...原创 2022-03-01 14:24:25 · 1179 阅读 · 1 评论 -
Ajax——上传文件及显示上传进度案例
实现步骤:定义 UI 结构验证是否选择了文件向 FormData 中追加文件使用 xhr 发起上传文件的请求监听 onreadystatechange 事件1. 定义UI结构<!--1. 文件选择框--><inputtype="file"id="file1"/><!--2. 上传按钮--><buttonid="btnUpload">上传文件</button>...原创 2022-03-03 23:08:14 · 870 阅读 · 0 评论 -
Ajax——淘宝搜索框案例
1.获取用户输入的搜索关键词为了获取到用户每次按下键盘输入的内容,需要监听输入框的 keyup 事件 //监听文本框的keyup事件 $('#ipt').on('keyup',function(){ //获取用户输入的内容 varkeywords=$(this).val().trim() //判断用户输入的内容是否为空 if(keywords.length<=0){ // 如果关键词为空,则清空后隐藏搜索建议列表...原创 2022-03-05 14:15:29 · 475 阅读 · 0 评论 -
Ajax——基于bootstrap的图书管理案例
1.渲染页面UI结构导入bootstrap.css + jquery.js插件:bootstrap 3 snippets1.1添加图书的Panel面板.bs3-panel-primary: Panel主面板.bs3-input-group:addon:text:带有名字的输入框.bs3-button-primary:添加按钮 <!-- 添加图书的Panel面板 --> <div class="panel panel-primary"&...原创 2022-03-01 13:35:33 · 1264 阅读 · 0 评论