面向对象,继承,浏览器,上传文件, ajax
'use strict';
//父类
class Student2{
constructor(name){
this.name = name || 'tom';
}
hello(){
console.log('hello '+ this.name + '!');
}
}
var xiao = new Student2("jack");
xiao.hello(); //子类继承父类
class PrimaryStudent2 extends Student2{
constructor(name,grade){
super(name); // 记得用super调用父类的构造方法!
console.log(this);
this.grade = grade;
this.name = name;
}
mygrade(){
console.log(this.name +' at grade '+ this.grade);
}
}
var primary = new PrimaryStudent2('jack' ,'2');
primary.mygrade();
primary.hello();//调用父类的方法
navigator 对象表示浏览器的信息,最常用的属性包括: navigator.appName:浏览器名称;
navigator.appVersion:浏览器版本;
navigator.language:浏览器设置的语言;
navigator.platform:操作系统类型;
navigator.userAgent:浏览器设定的User-Agent字符串。
location http://www.example.com:8080/path/index.html?a=1&b=2#TOP
location.protocol; // 'http'
location.host; // 'www.example.com'
location.port; // '8080'
location.pathname; // '/path/index.html'
location.search; // '?a=1&b=2'
location.hash; // 'TOP'
要加载一个新页面,可以调用location.assign()。如果要重新加载当前页面,调用location.reload()方法非常方便。 if (confirm('重新加载当前页' + location.href + '?')) {
location.reload();
} else {
location.assign('/discuss'); // 设置一个新的URL地址
}
图片上传并显示
var fileInput = document.getElementById('test-image-file'),
info = document.getElementById('test-file-info'),
preview = document.getElementById('test-image-preview');
// 监听change事件:
fileInput.addEventListener('change', function () {
// 清除背景图片:
preview.style.backgroundImage = '';
// 检查文件是否选择:
if (!fileInput.value) {
info.innerHTML = '没有选择文件';
return;
}
// 获取File引用:
var file = fileInput.files[0];
// 获取File信息:
info.innerHTML = '文件: ' + file.name + '<br>' +
'大小: ' + file.size + '<br>' +
'修改: ' + file.lastModifiedDate;
if (file.type !== 'image/jpeg' && file.type !== 'image/png' && file.type !== 'image/gif') {
alert('不是有效的图片文件!');
return;
}
// 读取文件:
var reader = new FileReader();
reader.onload = function(e) {
var
data = e.target.result; // 'data:image/jpeg;base64,/9j/4AAQSk...(base64编码)...'
preview.style.backgroundImage = 'url(' + data + ')';
};
// 以DataURL的形式读取文件:
reader.readAsDataURL(file);
});
---恢复内容结束---
面向对象,继承,浏览器,上传文件, ajax的更多相关文章
- 使用input:file控件在微信内置浏览器上传文件返回未显示选择的文件
使用input:file控件在微信内置浏览器上传文件返回未显示选择的文件 原来的写法: <input type="file" accept="image/x-png ...
- Android上传图片到PHP服务器并且支持浏览器上传文件(word、图片、音乐等)
暑假已经过了一半了,这才完成计划当中的第二个任务.虽然进度是慢了点.但也算是暑假的收获吧.下面我就把我学习当中的收获记录在此. 还是跟以往一样,先上图片. 操作的步骤:打开程序---->选择上传 ...
- 异步上传文件,ajax上传文件,jQuery插件之ajaxFileUpload
http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 一.ajaxFileUpload是一个异步上传文件的jQuery插件. ...
- IE浏览器上传文件时本地路径变成”C:\fakepath\”的问题【转】
转自:http://www.iefans.net/ie-shangchuan-bendi-lujing-fakepath/ 在使用<input id="file_upl" t ...
- IE浏览器上传文件时本地路径变成”C:\fakepath\”的问题
在使用<input id="file_upl" type="file" />控件上传文件时,有时会需要获取文件本地路径展示给客户,这时可以通过这样的 ...
- models渲染字典&form表单上传文件&ajax上传文件
{# {% for u in teacher_d.keys %}#} {# {% for u in teacher_d.values %}#} {% for k,u in teacher_d.item ...
- 【TFS 2017】使用浏览器上传文件(TFVC)或者编辑代码,错误提示TF14098,需要对文件有PendChange 权限
从TFS 2015开始,微软在TFS系统中增加了一个非常吸引开发人员的功能,"快速代码编辑器" (Quick Code Editor).使用这个功能,你可以在任何安装了浏览器的设备 ...
- angularJS 在edge浏览器上传文件,无法主动触发ng-click
今天发现的问题 在谷歌浏览器一直运行良好的功能,在edge浏览器不能使用. 代码参考我的另一篇博客:WebAPI Angularjs 上传文件 不能运行的原因 下图红框中的代码在edge浏览器中无法执 ...
- fromdata上传文件,ajax上传文件, 纯js上传文件,html5文件异步上传
前端代码: 上传附件(如支付凭证等) <input type="file" name="fileUpload" id="fileUpload&q ...
- IE浏览器上传文件后返回结果会自动弹出下载框
服务器使用的是node,其它语言的后台没测试过. 在IE低版本浏览器下,当你上传一个文件后后台会返回一些数据,但是IE浏览器会弹出下载提示. 这个问题是之前处理的了,没有细究,今天有人问到这个问题,顺 ...
随机推荐
- nginx实现动静分离--附nginx配置文件详解
转自http://www.cnblogs.com/1214804270hacker/p/9299462.html 一.认识访问静态资源与访问动态资源的区别 静态资源:指存储在硬盘内的数据,固定的数据, ...
- 部署LVS-NAT群集
案例环境 LVS调度器作为Web服务器池的网关,LVS两块网卡,分别连接内外网,外网地址172.16.16.172.24,同时也作为整个群集的VIP,内网地址为192.168.7.21-24/24,是 ...
- python 对mongodb进行压力测试
最近对mongoDB数据库进行性能分析,需要对数据库进行加压. 加压时,最初采用threading模块写了个多线程程序,测试的效果不理想. 单机读数据库每秒请求数只能达到1000次/s.而开发的jav ...
- 【CF1157F】Maximum Balanced Circle 求一个相邻元素之间绝对值为小于1的最大环
题目: https://codeforces.com/contest/1157/problem/F 给出一个序列 , 我们要从序列里面挑出一些数构造成一个相邻元素之间绝对值为小于1的最大环 , 挑选的 ...
- [转] Scala Async 库 (Scala future, await, async)
[From] https://colobu.com/2016/02/15/Scala-Async/ 在我以前的文章中,我介绍了Scala Future and Promise.Future代表一个异步 ...
- SpringMVC初写(五)拦截器
在系统开发过程中,拦截器的使用可以使我们实现一些需求.如:登录认证,权限管理等,拦截器的工作核心就是将一些工作流程进行统一处理 拦截器和过滤器的区别: 过滤器过滤的是请求路径,拦截器拦截的各层方法的映 ...
- vue中的双向数据绑定详解
前言 什么是数据双向绑定? vue是一个mvvm框架,即数据双向绑定,即当数据发生变化的时候,视图也就发生变化,当视图发生变化的时候,数据也会跟着同步变化.这也算是vue的精髓之处了.值得注意的是,我 ...
- MD5 工具类
package com.payease.chains.risk.utils; /** * md5密码加密工具类 * Created by liuxiaoming on 2017/8/28. */ pu ...
- WebDriver中的Actions对象
我们可以利用Actions对象来模拟鼠标的操作以及页面的拖拽 1.模拟鼠标的双击操作: 1)模拟双击一个div,验证点击之前的字体为14号 2)点击后字体为20号 Actions builder = ...
- JS中typeof和instanceof的用法和区别
typeof和instanceof的区别 instanceof 常用来判断一个变量是否为空,或者是什么类型的.但它们之间还是有区别的 instanceof的用法 instanceof返回的是一个布尔值 ...