网站 功能呢,企业网站建设业务报价单,百度给企业做网站吗,网站建设优化公司哪家好本节我们接着开发首页#xff0c;主要内容是 让左侧的请求记录和右侧的请求模块 联动起来。具体联动需求#xff1a;右侧请求一次之后#xff0c;左侧生成记录点击左侧记录#xff0c;右侧则会显示这次记录的请求数据我们本节课的内容是想办法实现1-生成记录。我们知道主要内容是 让左侧的请求记录和右侧的请求模块 联动起来。具体联动需求 右侧请求一次之后左侧生成记录点击左侧记录右侧则会显示这次记录的请求数据我们本节课的内容是想办法实现1-生成记录。 我们知道左侧的记录是存在于我们数据库的记录表中所以右侧请求模块只要请求就顺便把这些请求数据用户id 存储到记录表中即可。但是左侧的记录显示逻辑目前是进入首页后自动获取展示并没有实时刷新功能也就是我们请求完之后需要刷新页面才能在左侧看到记录但是刷新的话右侧的返回体什么的也烟消云散了。那么我们就要重新设计这个左侧记录的展示逻辑做成主动刷新。 一开始进到home的展示我们不用删除了只做后续请求成功后的刷新吧打开home.html,新建立一个js函数 这个函数要做的事有两个1.清空已显示的记录2.从数据库获取最新的记录生成展示我们现在先去架设好获取最新记录的 urls.py然后去写views.py 这里要特别说一下为什么这样写我们只从数据库拿出id,methodhost,url四个字段其他的不要拿因为都拿的话肯定数据太大超出了。我们只拿这几样需要显示的即可。等用户真的去点击某个记录的时候我们在用这个记录的id单独去后台数据库获取全部请求数据就行。 然后我们回过头打开home.html,输出一下ret看看对不对。还有我们要加上一个调用这个函数的代码才能调试好让我们重启服务打开浏览器控制台的-console刷新首页看看输出吧看来是获取成功了。接下来就是生成我们要用js代码实现这个html语言的循环。代码如下log_refersh()function log_refersh() { //清空 div document.getElementById(home_log_plan); div.innerHTML ; // 生成新的 $.get(/get_home_log/,{ },function (ret) { //ret 应该就是我们获取到的记录列表数组 的字符串形式 // 这里写生成展示的代码 console.log(ret); var res eval(ret); var all_logs res.all_logs; for(var i0; i var a document.createElement(a) ;//创建a标签 a.hrefjavascript:home_log_show() ; // 点击函数 a.styletext-decoration: none ; a.class log; var s document.createElement(span); //声明显示请求体类型的span s.style font-size: large;color: black; s.innerText all_logs[i].api_method - ; //设定这个method; var s2 document.createElement(span); // 声明存放hosturl的span s2.innerText all_logs[i].api_hostall_logs[i].api_url; a.appendChild(s); a.appendChild(s2); div.appendChild(a); div.appendChild(document.createElement(br)); } })}看看效果还是可以接受的。接下来就是我们要在右侧进行请求后把请求数据存放到数据记录表中然后再调用一下这个刷新log函数即可打开views.py找到Api_send_home()加入下图红框内容位置别弄错了。然后在home.html中 的函数最后获取到返回结果的时候 加入调用记录刷新函数log_refersh注意之前我们为了方便调试的那个一进页面就刷新的调用代码行可以删掉了。 然后重启服务刷新页面 随便请求点什么 看看效果。看来这个是成功了。但是还有瑕疵比如新显示的应该在最上面顺序反了。我们在后台函数首次进入和send请求的俩个位置逆转即可views.py中修改好了这样顺序就方便了。到这就完成了今天的内容。小伙伴可以在自行修饰。欢迎关注和分享 你们的饭饭
