接口测试平台代码实现32:接口列表备注功能

简介: 接口测试平台代码实现32:接口列表备注功能

备注功能是一个非常非常小的功能,所以我们先迅速处理掉这个备注功能

   让我们制作一个简单的备注输入框和保持/取消按钮,然后用户点击备注按钮就会显示这个输入框+保持/取消按钮。 保持和取消都会让输入框消失,但是保存功能多了一个像后台发送请求的过程,把备注内容给后台保存起来。

所以打开P_apis.html:

新建了这个div备注弹层:

微信图片_20220618190444.png

注意其中有个隐藏的input,这个是用来存储我们打开的接口的id的,以便我们点击保存按钮的时候,系统知道是要保存哪个接口的备注。注意这个div本体也要隐藏,只是为了方便调试,我们在最后才加上隐藏属性。

效果如下:

微信图片_20220618190456.png


然后我们给div加上id和隐藏属性,并写好打开它的函数:open_bz()然后让备注按钮onclick=这个函数。

微信图片_20220618190503.png

微信图片_20220618190511.png微信图片_20220618190516.png

完成之后测试一下,没问题后继续写 保存/取消函数:

取名为:save_bz,close_bz微信图片_20220618190522.png

我们先把取消功能函数close_bz写好:微信图片_20220618190528.png

测试一下么问题后,开始书写save_bz:

注意,这里我们要传入备注内容,也就需要给这个多行文本框加入一个id以便定位bz_value微信图片_20220618190536.png

路由就设置为:/save_bz/

然后我们urls.py微信图片_20220618190545.png

views.py:微信图片_20220618190551.png

然后我们要做到一个效果,就是每当用户打开任意接口的备注时,这个多行文本框都要显示保存好的,而不是一片空白。

所以我们回到P_apis.html中,找到open_bz()函数。

修改成如下:(前面.value不小心写成了.vallue,大家注意下微信图片_20220618190559.png

解释上图:先清空这个文本框,防止用户之前打开了其他接口的备注的内容显示在这个接口上。

然后请求后台,把接口id给过去,等后台返回这个接口的备注后,显示div,存放好id,把返回的备注加载到文本框。


所以我们继续写urls.py,增加一个获取备注映射微信图片_20220618190607.png

views.py:微信图片_20220618190613.png

然后我们重启服务,刷新页面,进行最终测试!

成功后即可等待下一节的难点了。

相关文章
|
15天前
|
人工智能 搜索推荐 Serverless
使用金庸的著作,来测试阿里通义千问最新开放的长文档处理功能
使用金庸的著作,来测试阿里通义千问最新开放的长文档处理功能
36 7
使用金庸的著作,来测试阿里通义千问最新开放的长文档处理功能
|
25天前
|
Java 关系型数据库 数据库连接
Mybatis+MySQL动态分页查询数据经典案例(含代码以及测试)
Mybatis+MySQL动态分页查询数据经典案例(含代码以及测试)
24 1
|
1月前
|
Java
【Java每日一题】— —第二十一题:编程把现实生活的手机事物映射成一个标准类Phone,并定义一个测试类PhoneDemo测试Phone类的功能
【Java每日一题】— —第二十一题:编程把现实生活的手机事物映射成一个标准类Phone,并定义一个测试类PhoneDemo测试Phone类的功能
35 0
|
2月前
|
JSON 搜索推荐 网络协议
玩转curl指令—测试简单的HTTP接口
玩转curl指令—测试简单的HTTP接口
51 0
|
29天前
|
缓存 运维 Serverless
应用研发平台EMAS产品常见问题之测试检查更新没有反应如何解决
应用研发平台EMAS(Enterprise Mobile Application Service)是阿里云提供的一个全栈移动应用开发平台,集成了应用开发、测试、部署、监控和运营服务;本合集旨在总结EMAS产品在应用开发和运维过程中的常见问题及解决方案,助力开发者和企业高效解决技术难题,加速移动应用的上线和稳定运行。
|
1月前
|
机器学习/深度学习 人工智能 监控
视觉智能平台常见问题之体验产品的美颜测试关掉如何解决
视觉智能平台是利用机器学习和图像处理技术,提供图像识别、视频分析等智能视觉服务的平台;本合集针对该平台在使用中遇到的常见问题进行了收集和解答,以帮助开发者和企业用户在整合和部署视觉智能解决方案时,能够更快地定位问题并找到有效的解决策略。
23 1
|
1月前
|
Java 测试技术
单元测试编写可测试代码
单元测试编写可测试代码
19 2
|
2月前
|
人工智能 安全
外汇MT5/MT4交易所平台系统开发测试版/案例设计/策略步骤/功能需求/源码程序
When developing the MT5/MT4 foreign exchange documentary trading system, the following functions and intelligence can also be considered:
|
10天前
|
测试技术 C语言
网站压力测试工具Siege图文详解
网站压力测试工具Siege图文详解
19 0
|
1月前
|
JavaScript jenkins 测试技术
这10款性能测试工具,收藏起来,测试人的工具箱!
这10款性能测试工具,收藏起来,测试人的工具箱!