1.textarea高度自适应

这个非常有用,但是网上的解决方案都不尽人意,话不多说,上代码。

function auto (elem) {
var minHeight = 30
var change = function () {
elem.style.height = minHeight + 'px'
elem.style.overflowY = 'hidden'
if (elem.scrollHeight > minHeight) {
elem.style.height = elem.scrollHeight + 'px'
}
}
elem.addEventListener("input", change, false)
elem.addEventListener("focus", change, false)
elem.addEventListener("propertychange", change, false)
change()
}

思路很简单,根据内容高度不断重置textarea高度,绑定input, focus, propertychange事件

2.自动计算Y轴高度,先放算法参考链接:https://stackoverflow.com/questions/326679/choosing-an-attractive-linear-scale-for-a-graphs-y-axis

意思就是给定几个数值,要能在y轴上较好的展示(算出上下限和区间值)

function scaleNumber (max, min, i) {
let unround = (max - min) / i // 等分刻度
let x = Math.ceil(Math.log10(unround))
let pow10x = Math.pow(10, x)
let arr = [0.1, 0.2, 0.25, 0.3, 0.4, 0.5, 0.6, 0.7, 0.75, 0.8, 0.9, 1]
for (let item of arr) {
if (unround / pow10x <= item) {
var range = item * pow10x
break
}
}
console.log(range)
min = range * Math.floor(min / range)
max = range * Math.ceil(max / range)
return [max, min]
}

参数i表示需要分几段

3.json转table,这个比较简单但是也比较实用,就记录下来:

    function json2html (str) {
var reg = /\[{2}((?!\]\]).)+\]{2}/g
var jsonstrarr = []
var htmlstrarr = []
var result while((result = reg.exec(str)) !== null) {
// console.log(result)
jsonstrarr.push(result[0])
}
console.log(jsonstrarr)
for (let item of jsonstrarr) {
let obj = JSON.parse(item)
let htmlstr = `<table cellpadding="0" border="1">`
for (let i of obj) {
htmlstr += '<tr>'
for (let j of i) {
htmlstr += `<td colspan="${j.col}" rowspan="${j.row}">${j.value}</td>`
}
htmlstr += '</tr>'
}
htmlstr += '</table>'
htmlstrarr.push(htmlstr)
}
let newstr = str
for (let index in jsonstrarr) {
newstr = newstr.replace(jsonstrarr[index], htmlstrarr[index])
}
return newstr
}

实用小工具不定期合集(textarea 高度自适应、自动计算Y轴刻度、json转table)的更多相关文章

  1. Python趣味实用小工具

    代码地址如下:http://www.demodashi.com/demo/12918.html python 趣味实用小工具 概述 用python实现的三个趣味实用小工具: 图片转Execl工具 , ...

  2. ANDROID开发实用小工具

    分享一些 Android开发中的实用小工具,你有发现好工具吗? 来这里分享一下呗 一.find bugs 静态检查工具 http://findbugs.sourceforge.net/ FindBug ...

  3. 批量下载网站图片的Python实用小工具(下)

    引子 在 批量下载网站图片的Python实用小工具 一文中,讲解了开发一个Python小工具来实现网站图片的并发批量拉取.不过那个工具仅限于特定网站的特定规则,本文将基于其代码实现,开发一个更加通用的 ...

  4. 微信小程序解决方案合集

    微信小程序解决方案合集:http://www.wxapp-union.com/special/solution.html 跳坑系列:http://www.wxapp-union.com/forum.p ...

  5. (转)超全整理!Linux性能分析工具汇总合集

    超全整理!Linux性能分析工具汇总合集 原文:http://rdc.hundsun.com/portal/article/731.html 出于对Linux操作系统的兴趣,以及对底层知识的强烈欲望, ...

  6. 实用小工具推荐 OpenWrite

    [实用小工具推荐]给技术同学们推荐一款比较好用的工具,可以实现一稿多发,主流的技术渠道基本涵盖了:https://www.openwrite.cn/ 因为工作的关系,认识了很多做技术公众号的小伙伴,同 ...

  7. 实用小工具:screen

    实用小工具:screen 首先,吹爆screen screen,实现了不间断的会话服务,通过SSH连接至远程服务器,当使用了screen开启的会话,不会因为你断开SSH而中断在远程服务器上运行的命令. ...

  8. textarea高度自适应自动展开

    在使用之前,推荐两个比较好的事件,分别是oninput和onpropertychange,IE9以下不兼容oninput.在textarea发生变化时,可以通过监听这两个事件来触发你需要的功能. te ...

  9. Xcode 4.1实用小工具:模拟网络连接和带宽

    暂无评论 适用于Mac OS X Lion的开发套件Xcode 4.1中,有个新鲜的小工具叫做Network Link Conditioner(网络连接调节器),是一款具有高度可定制性的辅助工具,让用 ...

随机推荐

  1. git教程3-分支

    https://git-scm.com/book/zh/v1/Git-%E5%88%86%E6%94%AF-%E5%88%86%E6%94%AF%E7%9A%84%E7%AE%A1%E7%90%86 ...

  2. ES6工作中常用知识点

    好久不动笔了 第一个知识点:import 和 export import导入模块.export导出模块 //全部导入 import people from './example' //有一种特殊情况, ...

  3. 使用open live writer客户端写博客(亲测有效)

    博客都开了这么久了,才开始将资料上传,但是每次都要登录网页确实很麻烦,所以就用open live writer,使用起来真的是挺方便的,所以将我在安装配置时,发现的问题汇总起来以便日后再次碰到忘记怎么 ...

  4. vs2017通过模块文件添加自定义注释

    有时我们在VS里建立类和接口时,需要添加比较规范的注释信息,而每次都要复制粘贴比较麻烦,所以需要我们的IDE做一些支持,比较修改VS里自定义的注释模式,以添加自己公司需要的信息格式. 注释比较规范,是 ...

  5. 【Linux】Linux查看程序端口占用情况

    使用命令查询8880端口的占用信息: netstat -naop|grep 查询结果: 发现8880端口被PID为4518的进程占用 使用命令查询所有的进程和端口使用情况: netstat –apn ...

  6. Kotlin基础知识

    1. 改进点/基础 //安全判空 val length = text?.length; //类型转换 if (object is Car) { var car = object as Ca } //操 ...

  7. java字符串与二进制的相互转化

    public class StrBinaryTurn { // 将Unicode字符串转换成bool型数组 public boolean[] StrToBool(String input) { boo ...

  8. dell电脑 win8换win7重启报错及解决方案

    Win8换win7 bios 识别不到usb选项 按以下操作即可: 把Secure Boot control 改为Disabled 的,F10保存重启,F12进入bios选择usb启动即可: 安装完系 ...

  9. Swift网络库Alamofire的导入

    一.手动导入 1, 官网下载 Alamofire 2, 解压下载的文件 放入工程的顶层目录下 3, 打开工程 Add Files 4, 选中项目 TARGETS > General > E ...

  10. JFrame 布局

    引用文章:https://blog.csdn.net/zyj0813/article/details/78309739