一. Js实现代码如下<!DOCTYPE html> <html lang="en"> <head> <style type="text/css"> #rect { width: 200px; height: 200px; background: gray; } </style&gt
Vue 实现前端权限控制 登录&&权限流程图前言首先我们确定的权限控制分为三大部分,其中根据粒度大小分的更细:登录权限控制页面权限控制 菜单中的页面是否可以被访问页面中的按钮 (增、删、改、查)的权限控制是否显示接口权限控制一、登录权限控制登录访问权限控制是对用户的校验。在用户登录成功之后,后台将返回一个token,之后前端每次进行接口请
转载 2023-08-12 11:32:02
262阅读
避免后端做太多的计算类的工作,则在前端进行统计操作。【如果您用的vue或者react等框架,请绕路~】1.纯js 简单实现
原创 9月前
142阅读
fastadmin前端表格组件使用的是bootstrap-table,如果我们想要自定义表格的内容,可以使用formatter属性。最常规的用法如下:columns: [ [ { field: 'type', title: __('type'), formatter: functi
三种弹出提示框:alertconfirmpromptalert()alert()方法是这三种对话框中最容易使用的一种,她可以用来简单而明了地将alert()括号内的文本信息显示在对话框中,我们将它称为警示对话框,要显示的信息放置在括号内,该对话框上包含一个"确认"按钮,用户阅读完所显示的信息后,只需单击该按钮就可以关闭对话框。 注意:alert()是一个阻塞的函数,如果我们不点确认按钮,后面的内容
用户上传头像然后截图的需求很常见,很多做法是把图像发送到后端,把裁剪后的结果发送给浏览器,这种方式会增加处理时延。最近正好学习了HTML5里的canvas,发现它的图片处理功能比较强大,就打算用canvas提供的API实现前端的剪切。这里头关键有三步:显示未经处理的图片,得到裁剪区域,显示裁剪后的区域。我们分别讨论: 1. 显示未经处理的图片      &
转载 2023-08-30 23:03:03
90阅读
最近做的项目要求实现预览word, pdf,png等文件功能,pdf以及png都很简单,轻松百度搞定,但是word预览研究了好久,所以特此记录分享。前端实现预览word分为两种,一种是上传前预览(也就是前端使用input或者组件等选择文件后直接预览,此时还没有上传给后端,我定义为纯前端预览),一种是上传后预览(就是文档已经上传到后端,通过后端给的文件流实现预览)一、先说第一种的实现方式:首先下载安
JQuery的使用1、JQuery是什么JQuery是一个js的框架 JQuery实际上就是对js的一种封装 这个封装的目的 是为了 让我们的js操作 更加简单 JQuery他的实现功能和JS实现的功能是一样的 jQuery的出现就是为了简化js的操作2、JQuery能干什么js能干的事情JQuery能干,而且代码更加简洁 js不能干的一些操作JQuery也能干3、JQuery的使用JQu
1、方案调研业务需要实现vr全景,类似于汽车之家,或者是贝壳看房之类的。经过技术调研,主流实现技术方案主要有3种:1、threejsthreejs在3D流域的应用不用多说,但是最终实际效果不好、threejs的api多于繁杂等原因放弃。2、css3D没错,css也可以实现这些vr全景效果,考虑到兼容性以及实际体验,最终还是放弃了。3、pano2vr或者krpano经过实践,这些第三方软件做出的效果
前端实现路由的方式主要有两种:hash模式和history模式、前端路由的本质为url改变页面不刷新、达到视图数据改变的结果。1.hash模式: window对象的location属性值里的 hash属性可以拿到hash值:window.location.hash。 window对象的全局方法hashchange()可以监听到hash值得变化。 主要基于这个原理来实现hash模式的前端路由。实例代
一、Object.assign是什么?      首先了解下Object.assign()是什么。我们先看看ES6官方文档是怎么介绍的?可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。对象属性的合并。二、用法:      Object.assign(target, ...sources)  参数:target-
之前开发项目中使用的打印的插件是easy-print,这个插件是基于以hiprint(http://hiprint.io/)的打印插件,我们的项目中主要打印的是表格数据,在测试阶段发现了调用打印会使页面卡死,排查问题,发现原因是因为这个hiprint打印表格类型的时候,如果一行数据展示不下会分页,不 ...
转载 2021-08-30 16:36:00
469阅读
2评论
前言前段时间有一个朋友问我前端能否实现拖放功能,大体是用拖放来调整列表顺序。 虽然我没有做过,但我见过有这种功能这样的网站呀,所以毫不犹豫的说绝对可以实现(反正不是我写)。 谁知道才过去不到一周,我自己所就职的公司也要添加一个拖放功能,而且还升级了,比拖放改变列表顺序难度更大。。。。,没办法,做呗。 好在我在我朋友问我的时候去网上查了下资料,看到了html5中有这么一个功能。 话不多说,开始干吧。
前言:今天给大家带来的是前端数据的分页功能先上一波效果图展示: 直接上代码:这里使用的是JavaScript来实现关于代码详解都以注释的方式写在JavaScript里的HTML:<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>分页&l
前言这两天写了一个个人项目-留言墙:一个以在线便利签的形式,也可以扩展成许愿墙、树洞的一个项目。起先功能点很少,后面慢慢加入了一些留言总的建议性改造或者优化。比如:增加字体和标题颜色增加分页那本文想说的就是这个前端分页:实现效果:首先的问题是可以获取到全部数据的情况下,怎么实现分页 其实这个问题很简单,全部数据取到的情况下,那当然是点到哪个页面是显示那页的内容即可,只要展示对应内容即可。正常简单分
转载 2023-06-06 10:50:41
747阅读
前端入门文章一、基本环境准备1.1、在线文档1.2、编辑器1.2.1、VS Code插件安装二、HTML字符实体和常用标签2.1、HTML5基本结构2.2、字符实体2.3、meta标签2.4、语义标签2.5、布局标签2.6、列表2.7、超链接2.7.1、 外部地址2.7.2、内部地址2.7.3、新建页面2.7.4、锚点跳转2.8、图片2.9 内联格式 iframe2.10 音视频三、CSS语法与
一、页面性能测试概述页面性能测试则是针对于页面性能优化而开展的一种性能测试目的是对Web系统的页面进行测试以确认系统页面是否会影响系统的性能并为页面的优化提供依据与建议,最终提升系统的整体性能表现,提高用户体验满意度。可见,Web系统页面性能测试是相对Web系统后台测试的另外一种性能测试,是Web系统性能测试的一个重要部分。前端性能和后端性能区别:他们关注点不同,前端性能关注单个用户的感受。后端性
这段时间因为项目需要,要做一个分页的功能,具体来说就是希望从数据库每次只取一部分结果,这样每页就显示那些结果,实现原理很简单,就是建立一个Pageutil类,里面放当前访问的页数(这个是从客户浏览器传到后台的数据,所以你的分页需要用它来定位记录的条目)和每一页显示的记录行数。然后通过分页计算就可以得出下列数据。分页对象代码:public class PageUtil { private int
转载 2023-06-29 18:58:05
174阅读
  分页场景常见于电商网站,比如说淘宝天猫的评论区,分页功能一般是后台实现前端请求就完事了。现闲得无聊,就写出来玩玩,只实现功能,并未封装。基于jq实现分页功能,大致分为以下几步:定义一个分页方法,可多次调用参数设置请求数据页面跳转方法创建非数字按钮和数据内容区创建数字按钮首屏加载调用结构层只需要一个容器 <div class="pagination-nick"></div&
  • 1
  • 2
  • 3
  • 4
  • 5