前端 用法记录
1、模拟键盘事件
$("#test").keyup(function(event) { console.info(event.keyCode) // 从keycode 转换为 字符 console.info(String.fromCharCode(event.keyCode)) }); var e = jQuery.Event("keyup"); e.keyCode =65; $("#test").trigger(e);
输出结果:
2、实现超出几行,后面加省略号+更多、
function LimitNumber() { var divHeight = $(".intro-r").height(); var $p = $("#introText"); var flag = false; while ($p.outerHeight() > divHeight) { $p.text($p.text().replace(/(\s)*([a-zA-Z0-9]+|\W)(\.\.\.)?$/, "...")); flag = true; }; if(flag) { var str = $.trim($("#introText").text()); str = str.substring(0,str.length-10)+ '......'; $p.text(str) } }
3、软键盘弹出
var u = navigator.userAgent; var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端 if (isAndroid) { var winHeight = $(window).height(); //获取当前页面高度 $(window).resize(function(){ var thisHeight=$(this).height(); if(winHeight - thisHeight >50){ $(".precept-cnt").css("top", "25%"); }else{ $(".precept-cnt").css("top", "62%"); } }); }
4、文字两端对齐
法一:(兼容性有问题)
text-align: justify;
text-align-last: justify;
法二:
.score-record-list .item .opt button.border { border: 1px solid #24bd54; background: #fff; color: #24bd54; text-align:justify; height: 55px; line-height: 55px; overflow:hidden; } .score-record-list .item .opt button.border:after{ content: ""; display: inline-block; width: 100%; }
5、去除input[number]的默认上下箭头
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance:textfield; }
6、获取某一天对应的星期一的日期
function getMonOfWeek(date) { var day = date.getDay() || 7; return new Date(date.getFullYear(), date.getMonth(), date.getDate() + 1 - day); }; // 使用 getMonOfWeek(new Date("2018-06-26"))
7、计算某元素距离底部的距离
var $parentContent = document.querySelector('.audit-list-content'); var scrollBottom = $parentContent.scrollHeight-$parentContent.scrollTop-$parentContent.clientHeight;
8、计算某元素距离可视窗口底部的距离
某元素的高度:selectHeight: (function(){ return 2.9*window.innerWidth/750*100; })() 结果:window.innerHeight - $event.currentTarget.getBoundingClientRect().bottom < this.selectHeight