Javascript
张张张96
永不妥协。
展开
-
工作笔记总结
好记性不如烂笔头Flexflex:direction :row/ column 横向排列 纵向flex-warp :warp 拆行拆列display: -webkit-flex;display: -ms-flexbox;display: -webkit-box;H5与Android和IOS 交互h5 传参数给 Android//$("#login").attr("href","Javascript:android.returnAndroid('"+ sendData + "')")原创 2021-01-28 15:00:25 · 210 阅读 · 0 评论 -
移动端 H5 上传图片 ios拍照上传横屏显示
问题描述:ios上传图片到服务器,渲染到页面上之后会旋转90度,android显示正常。上传图片方案:选择按钮change事件,实例化fileReader,调它的readAsDataURL并把原生File对象传给它, 监听它的onload事件,load完读取的结果就在它的result属性里了。它是一个base64格式的,可直接赋值给一个img的src.ios拍照上传横屏方案:ios相机拍照时自动加入了方向传感器(Orientation属性 ),能够记录相机拍摄的方向,相机可以根据这个方向信息,系统原创 2021-01-21 17:00:53 · 1042 阅读 · 4 评论 -
html页面 生成pdf
方法主要用到html2canvas.js 和 pdf.debug.js原理html2canvas.js :通过canvas将HTML生成的DOM节点绘制到画布上,再可以通过自己的需求转换成图片pdf.debug.js:将图片转成pdf注意点html2canvas的配置项中配置 allowTaint:true 或 useCORS:true(二者不可共同使用,需要生成base64 用后者)img标签增加 crossOrigin=‘anonymous‘图片服务器配置Access-Cont原创 2020-10-14 17:02:45 · 589 阅读 · 0 评论 -
JS浏览器与串口通信报错篇(二)
一、 注册MOSCOMM.OCX 并且已修改注册表还没加载出来解决办法: 执行mscomm.html在代码中,要插入ActiveX的classID。执行相当于编译ActiveX,可以得到一个MyActiveX.ocx文件,这个文件就相当于dll文件。这步操作完成之后才可以在IE 管理加载项里出现二、 注册MOSCOMM.OCX 并且已修改注册表,也执行了情况一,那么需要下载MSINET.OC...原创 2020-04-06 14:06:19 · 589 阅读 · 2 评论 -
jq绑定事件方法及区别
第一种方式:$(document).ready(function(){ $("#clickme").click(function(){ alert("hello world click") })})第二种方式(简写方式为第一种):$('#clickmebind').bind("click", function(){ alert("Hello World bi原创 2017-07-30 16:15:44 · 920 阅读 · 0 评论 -
分享一些前端开发中最常用的JS代码片段
HTML5 DOM 选择器// querySelector() 返回匹配到的第一个元素var item = document.querySelector('.item');console.log(item);// querySelectorAll() 返回匹配到的所有元素,是一个nodeList集合var items = document.querySelectorAll('.item');c转载 2017-07-28 23:54:59 · 413 阅读 · 0 评论 -
数组去重复方法总结
数组去重复方法总结// 方法一 思路:创建一个存放原数组第一个数的新数组,用原数组与新数组的数一一对比,不同则存放进新数组里 function repArr(oldArr){ var newArr=[oldArr[0]]; for(var i=0;i<oldArr.length;i++){ var repeat=false;转载 2017-08-12 16:25:34 · 1019 阅读 · 0 评论 -
阻止a链接跳转方法总结
有时我们会遇到这种需要在a标签上添加click事件,并且跳转前处理一些事务,因此需要做一些处理,看很多人会这样写<a href="#">link</a>, 但是发现点击后页面返回了顶部,所以又出现了这样的写法等<a href="###">link</a> 但这样并不兼容所有浏览器,有些浏览器就会出现很怪异的形为。 因此,这个问题还需要其它方法来解决。方法一<a href="jav原创 2017-08-15 17:33:40 · 16287 阅读 · 0 评论 -
JS实现中文转拼音
1. 汉字转拼音,其中每一个字的首字母大写(l例如:ZhangSan 张三)pinyin.getFullChars(name);2. 汉字住转拼音 提取首字母且为大写形式(l例如:ZS 张三)pinyin.getCamelChars(name);3. 汉字转拼音方法var pinyin = (function (){ var Pinyin = function (ops){...转载 2019-04-19 13:11:39 · 34101 阅读 · 1 评论 -
每个前端开发者必会的20个JavaScript面试题
问题1:JavaScript 中 undefined 和 not defined 的区别JavaScript 未声明变量直接使用会抛出异常:var name is not defined,如果没有处理异常,代码就停止运行了。 但是,使用typeof undeclared_variable并不会产生异常,会直接返回 undefined。var x; // 声明 xconsole.log(x); /转载 2017-07-30 00:59:28 · 1846 阅读 · 0 评论 -
改变Select三角样式
改变小三角<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><style> select { /*Chrome和Firefox里面的边框是不一样的,所以复写了一下*/ border: solid 1px #000;原创 2017-06-25 00:07:17 · 843 阅读 · 0 评论 -
红绿灯简单模拟
子文件 <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>子窗口</title> <style> //计时文本框的样式 #con{width:50px;height:30px;text-align: center;line-height: 30px;fon原创 2017-06-16 17:16:35 · 2162 阅读 · 0 评论 -
选项卡
关于选项卡效果常规传参(可设置多个参数值)回调函数下面是几种参考方法常规方法<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><style> *{margin:0;padding:0;} ul,li{list-style: none;d原创 2017-06-17 23:47:16 · 327 阅读 · 0 评论 -
凡客放大镜效果
凡客放大镜效果<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> .left{ width:400px; height: 400px; border:1px solid原创 2017-07-01 23:45:47 · 249 阅读 · 0 评论 -
表单验证
java script验证表单时常用: "^-[0-9]*[1-9][0-9]*$" //负整数 "^-?//d+$" //整数 "^//d+(//.//d+)?$" //非负浮点数(正浮点数 + 0) "^(([0-9]+//.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*//.[0-9]+)|([0-9]*[1转载 2017-07-01 23:50:05 · 220 阅读 · 0 评论 -
回顶部总结一
方法一 锚链接<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body><div id="box" style="height:2000px;background:red;"></div><a href="#box" style="position: f原创 2017-06-22 21:10:01 · 252 阅读 · 0 评论 -
回顶部总结二(动画)
关于回顶部加动画效果 动画有两种:一种是CSS动画,需要有样式变化配合transition;一种是javascript动画,使用定时器来实现 主要实现javascript动画即定时器 1.setInterval、2.setTimeout和3.requestAnimationFrame这三种可以setTimeou<!DOCTYPE html><html><head la原创 2017-06-22 21:11:23 · 244 阅读 · 0 评论 -
DOM 节点方法
DOM节点方法 1.createElement() 创建元素节点 2.creatTextNode() 创建文本节点 3.添加(插入)节点 (1) 元素.appendChild(文本) 将文本加到元素节点 将元素节点添加到父节点 (2)元素.pa原创 2017-06-11 15:53:27 · 359 阅读 · 0 评论 -
数组去重复
数组去重复<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body><script> function show(arr){ for(var j=0;j<arr.length;j++){ //循环i号后面的元素和原创 2017-06-25 00:01:35 · 285 阅读 · 0 评论 -
window对象
window对象对象:document/event/history/frame/location属性: opener 返回对创建此窗口的窗口即父窗口 closed 返回窗口是否已被关闭。方法:window.open(url ,新窗口名字,新窗口特性,是否替换历史新纪录)window.close() 关闭浏览器窗口alert() 显示带有一段消息和一个确认按钮原创 2017-06-16 16:42:48 · 236 阅读 · 0 评论