JS中利用FileReader实现上传图片前本地预览功能 js/jQuery

热文JS中利用FileReader实现上传图片前本地预览功能

【导读】引子平时做图片上传预览时如果没有特殊的要求就直接先把图片传到后台去,成功之后拿到URL再渲染到页面上,这样做在图片比较小的时候没什么问题,大一点的话就会比较慢才能看到预览了,而且还产生了垃圾文件,所以比较好的是上传之前先在本地预览一下。之前做项找插件的时候就知道纯前端可以实现图片本地预览,可今天面试的时候被问到时竟然一脸懵逼,然后竟然无意中就在电脑桌面发现了实现的demo,然后根据demo查了一下API,稍微总结下:首先得拿到File对象当用input标签上传图片时event对象中会包含file对象的一个集合event.target.files核心是FileReader对象根据MDN上的说法:...

解读IE和firefox下JScript和HREF的执行顺序 js/jQuery

热文解读IE和firefox下JScript和HREF的执行顺序

【导读】很久都没有写关于代码方面的文章了。主要原因还是因为最近的工作都集中在需求分析方面,没有了现实中的感触,就没有了写作的动机。讨论一个关于JScript执行顺序的问题。示例代码如下:a.htmlt;Aonmouseup="func('onmouseup')"href="b.htm"gt;ClickMe!lt;/Agt;lt;Aonclick="func2('onclick')"href="d.htm"gt;ClickMe!lt;/Agt;lt;SPANid=msggt;lt;/SPANgt;lt;SCRIPTgt;fu...

JavaScript中有关一个数组中最大值和最小值及它们的下表的输出的解决办法 js/jQuery

热文JavaScript中有关一个数组中最大值和最小值及它们的下表的输出的解决办法

【导读】今天在学习js中的数组时,遇到的输出一个数组中最大、最小值以及它们的下表,以下是自己的解决方法!lt;scripttype="text/javascript"gt;vararr=[14,14,53,14,14,53,67,67];varmax=arr[0],min=arr[0];varmaxIndex=[];maxIndex[0]=0;varminIndex=[];minIndex[0]=0;varj=1,k=1;for(vari=1;ilt;arr.length;i++){if(maxlt;arr[i]){max=arr[i];maxIndex[0]=i;}if(ming...

IE6下javasc#ipt:void(0) 无效的解决方法 js/jQuery

热文IE6下javasc#ipt:void(0) 无效的解决方法

【导读】IE6下,JSP中链接问题:lt;ahref="javascript:void(0);"target="mainFrame"onClick="btnHome_onClick()"gt;lt;javascriptgt;functionbtnHome_onClick(){window.open("com.mcl.common.main.InitHome.flow","mainFrame");if(winoperate.style.display!="none"){silde_on...

Js nodeType 属性全面解析 js/jQuery

热文Js nodeType 属性全面解析

【导读】定义和用法nodeType属性返回被选节点的节点类型。语法:elementNode.nodeType节点编号:节点名称:1Element2Attribute3Text4CDATASection5EntityReference6Entity7ProcessingInstrucion8Comment9Document10DocumentType11DocumentFragment12Notation...

javascript js cookie的存储,获取和删除 js/jQuery

热文javascript js cookie的存储,获取和删除

【导读】使用方法://1、存储Cookie//2、参数说明:1、参数1:Cookie存储Name,参数2:Cookie要存储的值//3、例子如下:setCookie('Method',match);//1、获取Cookie//2、参数说明:1、参数1:Cookie存储的Name//3、例子如下:getCookie('Method')//1、删除Cookie//2、参数说明:1、参数1:Cookie存储的Name//3、例子如下:deleteCookie('Method');函数如下:代码如下:lt;scriptlanguage=javascriptgt;/**//*******************...

用Javascript数组处理多个字符串的连接问题 js/jQuery

热文用Javascript数组处理多个字符串的连接问题

【导读】代码如下:varstr=newArray();str[0]='lt;liid="domain-{0}"gt;'.replace('{0}','domainid');str[1]='domainname';str[2]='lt;inputtype="hidden"name="domainids"value="{0}"gt;'.replace('{0}','domainid');str[3]='lt;/ligt;';alert(str.join(''));////示例2//代码如下:varstr2=['lt;liid=...

完美解决手机网页中输入框被输入法遮挡的问题 js/jQuery

热文完美解决手机网页中输入框被输入法遮挡的问题

【导读】之前要做一个弹出对话框,填写信息,发现在手机上看的时候,较后的输入框在填写信息时,输入框被输入法遮挡,只能盲填。前提1.弹出的对话框用display:fixed定位的2.对话框大小固定解决办法css部分(dlg-top与dlg-bottom为对话框的类,用于确定对话框的定位方式).dlg-top{position:fixed;top:100px;left:10%;}.dlg-bottom{position:fixed;bottom:0px;left:10%;}js部分“deliver-dlg”为对话框的类//弹出对话框时,绑定的事件//绑定输入框获取焦点事件$(".deliver-d...

手动实现js短信验证码输入框 js/jQuery

热文手动实现js短信验证码输入框

【导读】前言本文记录一下自己手动实现的一个前端常见的短信验证码输入组件,从需求到实现逐步优化的过程。正文1.需求分析首先看一下效果图。首先页面加载的时候,输入框获取焦点,当用户输入一个数字后,焦点自动跳转到第二个框,当四个框全部输入后,模拟发送提交请求,这里用一个弹框提示,输出输入的验证码内容。主流程之外的需求:输入框内只能输入数字类型,不能输入字母,若强制输入非数字类型按下撤回键时候输入的验证码置空并且把当前焦点跳转至第一个输入框。2.完整代码实现。大致思路就是页面加载的时候,给第一个输入框添加autofocus属性,让其自动获取焦点,然后监听键盘点击事件,当键盘按下的时候,判断当前按键是否是数字按...

原生js实现移动开发轮播图、相册滑动特效 js/jQuery

热文原生js实现移动开发轮播图、相册滑动特效

【导读】使用方法:分别引用css文件和js文件如:lt;linkrel="stylesheet"type="text/css"href="css/photoSlider.min.css"/gt;lt;scriptsrc="js/photoSlider.min.js"type="text/javascript"charset="utf-8"gt;lt;/scriptgt;html:lt;ligt;lt;ahref="/"gt;lt;imgsrc="img/...

最新资讯

热门资讯