H5&CSS3--风琳博客

针对Element的表格优化打印

H5&CSS3 2022年09月07日 55 热度

一、背景客户的需求推动技术的进步。最近做了个表格的一键打印，结果遇到表格内换行的时候，打印会碰到一格分成了两页的情况。二、方案百度了一圈找不到方案，于是乎谷歌了一下，查技术资料这方面还是谷歌好用。tbodytr{ page-break-inside:avoid }这段代码可防止在一个tr内分成2页三、延伸打印的时候发现，el-table并不能每页都显示表头，这样不大美观。查看代码后发现，el-ta

JS对象根据Key排序

H5&CSS3 2019年12月25日 3,360 热度

直接上代码constunordered={ 'b':'foo', 'c':'bar', 'a':'baz' }; console.log(JSON.stringify(unordered)); //→'{"b":"foo","c":&

图片自动填满（非拉伸）

H5&CSS3 2019年10月18日 1,497 热度

需要将img放在一个div里面html：<divclass="xy-album-item"> <imgclass="xy-album-cover"src=""/> </div>css：.xy-album-item{ position:relative; display:inline-block; ove

JS实现打印完回调

H5&CSS3 2019年05月29日 157,313 热度

零、背景今天客户说要一个打印完后，自动把页面关闭（或者弹框询问是否关闭页面）的功能，查了一下，原来window底层就包含这个方法。一、代码varbeforePrint=function(e){ //打印前的业务代码 };varafterPrint=function(e){ //打印后的业务代码 };window.onbeforeprint=beforePrint; window.onafterpr

解决Ueditor再次编辑时，pre标签内容显示异常的问题

H5&CSS3 2019年02月01日 1,960 热度

零、扯个淡好吧，这个问题其实一直都存在，只是一直懒得修复→_→一、问题复现只要是带<>标签的，在pre中都会被转码，变成<和>。保存后在文章页中显示正常，但当再次编辑的时候，这些标签就会被过滤掉。二、解决方案先把文章内容放在一个不可见的div里面，原来的textarea里别放内容了<textareaid="contentEditer"

FormData 对象的使用

H5&CSS3 2017年09月04日 4,587 热度

通过FormData对象可以组装一组用XMLHttpRequest发送请求的键/值对。它可以更灵活方便的发送表单数据，因为可以独立于表单使用。如果你把表单的编码类型设置为multipart/form-data ，则通过FormData传输的数据格式和表单通过submit()方法传输的数据格式相同如何创建一个FormData对象Edit你可以自己创建一个FormData对象，然后通过调用它的appe

实现input密码框显示/隐藏的功能

H5&CSS3 2017年08月19日 12,943 热度

现在很多地方的注册都只有一个密码框，然后再加个显示/隐藏按钮，这样做很简洁，不用再很繁琐的输入两遍密码，用户能自己看到密码输入得对不对。所以幻幻也研究了一发实现方案：1. 首先来个密码框<ddclass="password"> <inputname=""type="password"class="n-txtCs

UEditor设置最大字数限制

H5&CSS3 2017年07月17日 9,801 热度

最近项目的富文本编辑器换成了UEditor，以为和kindeditor一样设置完就能实现字数限制（超过最大字数不能输入），实际上，UEditor只是给出了提示，并没有限制输入。所以就只能自给自足丰衣足食啦。1.搜索ueditor.all.js中的maximumWords，找到以下段落：countDom.innerHTML=errMsg; editor.fireEvent("wordcou

js获取图片二进制码，显示缩略图

H5&CSS3 2017年05月31日 6,102 热度

做聊天的时候需要图片的二进制码作为缩略图，研究了大半天找到了这个方法。说明：这段代码主要是将input[file]中的图片转换成二进制码，之后可以直接放入img标签中显示，也可以用于数据传输。字段说明：obj：文件，document.getElementById("xxx").files[0]area：区域大小callback：回调函数,其中_canvas参数就是图片的二进制码

html5离线存储

H5&CSS3 2016年10月09日 6,093 热度

STORAGE(存储)Cookie在HTML5以前我们会使用 cookie，在浏览器端缓存一些数据，例如：登录用户信息，历史搜索信息等等。但是cookie所支持的容量仅仅只有 4k ，也没有专门的api来操作，只能依赖一些开源的库，这里使用 cookies.js 存储和获取cookie信息//这是一个cookie值Cookies.set('key','value'

对DIV做placeholder效果

H5&CSS3 2016年09月13日 3,953 热度

当DIV加上contenteditable="true"作textarea用时，光写placeholder是没有效果的。.prefix_content:empty:before{ content:attr(placeholder); color:#bbb; } .prefix_content:focus:before{ content:none; }加上以上代码后，placeh

HTML5视频的那些事儿

H5&CSS3 2016年07月26日 4,875 热度

最近在研究HTML5播放视频的事情，发现这个东西真是据复杂无比啊，我勒个去了，然后给团队做了个技术分享。本文将总结下自己对视频研究的结果，做个记录，同时也能方便后来人的学习，涉及视频的方方面面。刚刚突然发现了自己800年前做的一个视频播放器，才想起来当时好像也研究过一点。视频其实视频早于Web而存在的，1990年Web诞生，但早在此之前视频就已经存在了，视频技术这么多年的发展，其历史复杂性超乎你的