vue项目兼容ie浏览器的问题:在其他浏览器显示都是正常的,在ie11下显示空白 5C

各位大神帮忙看看,为什么ie11下显示空白,也没有报错!!
图片说明
我的配置如下:
webpack.base.conf.js中添加了babel-polyfill:
module.exports = {
context: path.resolve(__dirname, '../'),
entry: {
app:["babel-polyfill", './src/main.js']
},
main.js下导入了babel-polyfill:import 'babel-polyfill'
.babelrc文件的配置为:

{
"presets": [
["env", {
"modules": false,
"targets": {
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
}
}],
["es2015", {
"modules": false
}],
"stage-2"
],
"plugins": ["transform-vue-jsx", "transform-runtime",
["import", {
"libraryName": "iview",
"libraryDirectory": "src/components"
}]
],
"env": {
"test": {
"presets": ["env", "stage-2"],
"plugins": ["transform-vue-jsx", "transform-es2015-modules-commonjs", "dyna mic-import-node"]
}
}
}



5个回答

解决方式:安装 "babel-polyfill" 即可。

命令:cnpm install --save-dev babel-polyfill    //我用的是淘宝镜像,所以是cnpm,如果你没有安装使用npm 即可。

在入口main.js文件引入:import 'babel-polyfill'

最后一步,在build文件夹下找到webpack.base.conf.js.

图片说明
将第10行的内容替换一下即可。

<br>
图片说明
把上图中的1替换成2即可,懒得动手就复制吧。

module.exports = {
entry: {
app: ["babel-polyfill", "./src/main.js"]
},

qq_38623459
95年大叔 回复qq_41187568: 那你应该会报错
8 个月之前 回复
qq_41187568
qq_41187568 我也是这么配置的,一部分显示出来了,一部分还是空白的
10 个月之前 回复
weixin_43855914
一个人儿 回复Beamon__: 有解决了吗?
大约一年之前 回复
weixin_43855914
一个人儿 回复岁月抹平了我的小脾气: 有解决了吗?
大约一年之前 回复
weixin_43855914
一个人儿 回复qq_15076441: 有解决了么?
大约一年之前 回复
qq_15076441
qq_15076441 回复岁月抹平了我的小脾气: 题主,我遇到了相同的问题,最后解决了吗,如何做呢?
一年多之前 回复
Beamon__
Beamon__ 回复u010603891: 我遇到了相同的问题,不知道老哥解决了么?如何做的
一年多之前 回复
u010603891
岁月抹平了我的小脾气 我就是这么配置的,可是还是不兼容ie
一年多之前 回复

安装babel-polyfill
npm install babel-polyfill --save-dev

module.exports = {
entry: {
app: ["babel-polyfill", "./src/main.js"]
},

在重新启动就行

大佬,重启了也不好使

图片说明 楼主解决了吗 我的也一样 babel-polyfill 也安装了

vipsongtaohong
vip.khan 回复琉鲂ペ佰世° 嘻嘻: 解决了 是安装的其他插件的语法没能转过来 你把你的插件检查一下
大约一年之前 回复
weixin_43855914
一个人儿 回复weixin_43120345:你有解决这个问题了吗?
大约一年之前 回复
weixin_43855914
一个人儿 回复vip.khan: 那这种情况要如何解决啊! 能告知下吗?谢谢!
大约一年之前 回复
vipsongtaohong
vip.khan 回复weixin_43120345: 解决了 按照安装 "babel-polyfill" 的方法如果还未能解决 看看项目中使用的插件和框架 多半是那些框架的语法没能转换成es5
大约一年之前 回复
weixin_43120345
weixin_43120345 解决这个问题了吗?求解方法
大约一年之前 回复

按照安装 "babel-polyfill" 的方法如果还未能解决 可以试着把对应的插件去掉,页面去掉,就会出来,因为按照网上那千篇一律的说法的确好使,唯一的问题就是控件不行

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
Vue项目兼容IE浏览器 使用babel-preset-env后依然无效

如题,使用babel-preset-env配置后 进行 run build 打包编译,打包后的代码 如 箭头函数,let 依然没有转为ES5语法,导致IE浏览器报错 报错如图(IE10): ![图片说明](https://img-ask.csdn.net/upload/201912/16/1576490114_823601.png) ![图片说明](https://img-ask.csdn.net/upload/201912/16/1576490159_725227.png) 以下是babel-preset-env相关配置: //babel.config.js: --- ``` javascript const plugins = []; if (['production', 'prod'].includes(process.env.NODE_ENV)) { plugins.push("transform-remove-console") } module.exports = { presets: [ [ "@vue/app", { "useBuiltIns": "entry", polyfills: [ 'es6.promise', 'es6.symbol' ] } ] ], plugins: plugins }; ``` //.babelrc --- ```javascript { "presets": [ "@babel/preset-env" ], "plugins": [ "@babel/plugin-transform-runtime" ] } ``` //Vue.config.js --- ```javascript module.exports = { transpileDependencies: ['webpack-dev-server/client'], publicPath: process.env.NODE_ENV === 'production' ? '/cdss/' : '/', outputDir: 'cdss', assetsDir: 'static', chainWebpack: config => { config.entry.app = ['babel-polyfill', './src/main.js']; } }; ``` //main.js --- ```javascript import '@babel/polyfill'; //第一行 import Es6Promise from 'es6-promise' Es6Promise.polyfill(); //...其他常规配置 ``` //package.json --- ```json //...其他常规配置 "browserslist": [ "> 1%", "last 2 versions", "ie <=8" ] ``` 难道是哪儿配置有问题吗?怎么改都不行 [这是我看的教程帖](https://blog.csdn.net/qq_42767631/article/details/91352267 "Vue-cli3 项目在安卓低版本系统和 IE 上白屏问题解决").

用vuejs框架怎么处理IE浏览器兼容性

用Vuejs写的ajax在IE不能渲染页面,求大神帮助解决在IE下的问题

ie11验证码无法显示,是插件的问题吗还是浏览器兼容性问题

ie11验证码无法显示,是插件的问题吗还是浏览器兼容性问题111111111111222222222222

vue开发环境中能正常在ie中运行,打包后就在ie中就出现无效字符

vue开发环境中能正常在ie中运行,打包后就在ie中就出现无效字符, 找了很久发现是导出word功能出现问题,求教如何解决,哪怕屏蔽在ie中屏蔽掉导出功能也行 ![这个是线上的](https://img-ask.csdn.net/upload/202005/18/1589800178_739696.png) ![这个是本地开发环境](https://img-ask.csdn.net/upload/202005/18/1589800205_532910.png)

vue脚手架搭的项目放服务器上后,用360浏览器打开一片空白

用vue脚手架搭的项目放服务器上后,用360浏览器打开一片空白,用谷歌和360极速浏览器打开就行,请问这个需要怎么做兼容?因为到时用户用的浏览器肯定不一样

echarts在IE11中个的兼容问题

使用echarts搭配AJAX显示柱状图表时,在IE11上页面第一次打开时回去请求 后台刷新数据,但是只请求一次就不会再请求,手动刷新页面都无效,除非关闭页面重新 打开 ,这种情况在谷歌,火狐测试下没有问题!!! 请问是兼容问题还是缓存?? 急!!!!! ``` $(function () { var myChart = echarts.init(document.getElementById('main')); myChart.showLoading({ text: "KM数据正在努力加载..." }); // 初始 option option = { tooltip: { trigger: 'axis', axisPointer: { // 坐标轴指示器,坐标轴触发有效 type: 'shadow' // 默认为直线,可选为:'line' | 'shadow' } }, legend: { data: ['考试通过', '学习时长/小时.分'] }, grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true }, xAxis: [ { type: 'category', data: [ ] } ], yAxis: [ { type: 'value' } ], toolbox: { show: true, feature: { //magicType: { type: ['line', 'bar'] }, dataView: { readOnly: false }, saveAsImage: {}, } }, series: [ ] }; myChart.setOption(option); var names = []; //盛放X轴坐标值 var nums = []; //盛放Y坐标值 var ntime=[0.15,1.32] $.get("Ashx/TestDemo.ashx?action=list", {}, function (data) { var msg = $.parseJSON(data); for (var i = 0; i < msg.length; i++) { names.push(msg[i].Sys_DeptName); nums.push(msg[i].count); } myChart.hideLoading(); myChart.setOption({ xAxis: [{ data: names }], series: [ { name: '考试通过', type: 'bar', data: nums }, { name: '学习时长/小时.分', type: 'bar', data: ntime }, ] }); }); }); ```

vue项目中已经引入babel-polyfill在ie9中还是报错

vue项目中已经引入babel-polyfill在ie9中还是报错polyfill-eventsource added missing EventSource to window

有区分360浏览器兼容模式和ie的方法吗??

如题,360浏览器兼容模式下,所有浏览器信息和ie一模一样。 有什么办法在只动用前端的情况下辨别出来的,用的是vue。

关于使用activeXObject判断IE浏览器

众所周知,IE有个activeXObject对象,来实现浏览器对本地文件的读写; 而其他的浏览器都是使用的XMLHttpRequest对象. 今天想到了利用IE独有的activeXObject对象来判断是否为IE浏览器,在网上搜到了如下代码 function isIE() { if (!!window.ActiveXObject || "ActiveXObject" in window) return true; else return false; } 但是关于这段代码, 我想知道为什么window.ActiveXObject前面要加两个!!,有什么具体讲究吗? 然后为什么要这样判断? "activeXObject" in window 和 window.activeXObject不是一样吗

项目在其他浏览都能正常运行,ie报错且页面为空白

![图片说明](https://img-ask.csdn.net/upload/201904/19/1555667401_201888.jpg) 报错js代码 // 初始化加载方式 const {getItem}= utils.localStorage; const setting = getItem("KITADMIN_SETTING_LOADTYPE"); if (setting !== null && setting.loadType !== undefined) { config.loadType = setting.loadType; } ``` ``` ``` ```

ie兼容问题,ie10以上都行

使用谷歌,火狐浏览器都可以正常数据显示,后台数据获可以取到,ie10,ie11都不可以,主要是push在数组里数组失败,也不报错,里面没有数据,求大神帮助 $(window).ready(function () { $.ajax({ url: appconfig.apiUrl + "/allService", traditional: true, type: "GET", success: function (data) { console.log("get......all"); console.log(data) lenovoService = {}; motoService = {}; if (data.success === true) { for (idx in data.all) { item = data.all[idx]; if (item.business_unit === "Lenovo") { if(null == lenovoService[item.category]){ lenovoService[item.category] = []; } lenovoService[item.category].push(item); // Vue.set(lenovoService[item.category], lenovoService[item.category].length, item); } else { if(null == motoService[item.category]){ motoService[item.category] = []; } motoService[item.category].push(item); // Vue.set(motoService[item.category], motoService[item.category].length, item); } } console.log(motoService) Vue.set(vm.serviceCatalog, "lenovo", lenovoService); Vue.set(vm.serviceCatalog, "moto", motoService); console.log(vm.serviceCatalog); } } }); });

ie,ff下css限制文字展示三行, 超出部分省略号

chrome,360,搜狗的展示是这种的样式 ![图片说明](https://img-ask.csdn.net/upload/201712/27/1514365199_967865.png) ![图片说明](https://img-ask.csdn.net/upload/201712/27/1514364651_679354.png) 下面这个图是在ie11下展示的图片,它省略号不管用了 ![图片说明](https://img-ask.csdn.net/upload/201712/27/1514364704_41857.png) 下面的这是我写的另一种方法,我想让它显示成想其他主流浏览器那种,展示几行后再显示省略号, ![图片说明](https://img-ask.csdn.net/upload/201712/27/1514364811_185711.png) ![图片说明](https://img-ask.csdn.net/upload/201712/27/1514364828_689643.png) ie和ff展示都是这种情况,我想让ie和ff和360那些的一样不知道改css的情况下有可能吗?因为不能使用js..

js判断浏览器是不是360浏览器

js判断浏览器是不是360浏览器,在网上搜了好多方法,都不能进行判断,求大神帮助

vue实现带截图和分屏的功能

右侧是菜单,左侧区域是视频,左侧区域视频做分屏处理,鼠标悬浮上去,展示播放 声音 以及选中 和截图下载功能。 分屏功能类似网站的这个功能:http://nvr.liveqing.com:10800/#/screen。这个网站视频点击选择通道就可以选中视频播放。 而且视频为h5视频。需要能播放rstp视频流地址: 下面是写的代码,但是不知道怎么不同视频播放不同rstp视频。并且还有截图功能。目前想到的是canvas截图功能,具体写法不怎么熟悉,而且希望图标能跟http://nvr.liveqing.com:10800/#/screen这网站的播放器图标类似,鼠标移入显示图标。目前我的视频图标是视频本身默认自带的。 我需要解决的问题是: 1、不同视频播放不同rstp视频 2、实现鼠标移入出现视频自定义图标, 3、实现视频截图功能。 4、分屏优化 5、最好是能提供播放rstp流的代码以及思路以及上面1、2、3、4等代码以及思路 要实现的详细功能阐述: 一、未播放状态 1、默认显示未播放状态 2、点击选中播放框,再单击左侧摄像机列表中的摄像机,对应选中的播放框中开始加载显示视频 二、播放中状态 1、显示实时视频画面,左上角显示当前时间、右下角显示摄像机名称 2、鼠标移入时显示截图、静音、全屏、关闭、视频算法选择select功能 (1)点击视频画面,选中当前视频播放框,可重新选中摄像机播放新的视频流 (2)点击右上角的“关闭”图标,关闭当前视频画面,显示为未播放状态 (3)鼠标移入右下角 截图图标,显示“截图”提示信息;点击截图图标,对当前画面进行截图,图片自动保存到系统-下载目录中 (4)视频默认播放有声音,可通过点击右下角的喇叭图标进行静音和取消静音切换,鼠标移入图标相应显示静音或取消静音提示信息 (5)右下角全屏,鼠标移入,显示“全屏”信息,点击将全屏显示当前视频 (6)左下角显示 实时视频和智能视频切换,智慧视频即叠加了算法的视频画面 ![图片说明](https://img-ask.csdn.net/upload/202006/07/1591505053_9990.png) 下面是写的分屏的代码: ``` <template> <!-- 分屏 --> <div style="overflow: hidden;"> <el-row type="flex" :gutter="10" justify="center" v-show="!fullscreen"> <el-col :span="4"> </el-col> <el-col :span="16"><div class="grid-content bg-purple"> <el-button-group> <el-button :type="classtype1" @click="selecttype('classtype1',1,24)">单屏</el-button> <el-button :type="classtype2" @click="selecttype('classtype2',4,12)">四分屏</el-button> <el-button :type="classtype3" @click="selecttype('classtype3',9,8)">九分屏</el-button> <el-button :type="classtype4" @click="selecttype('classtype4',16,6)">十六分屏</el-button> <el-button > <div class="btn-fullscreen" @click="handleFullScreen"> <el-tooltip effect="dark" :content="fullscreen?`取消全屏`:`全屏`" placement="bottom"> <i class="el-icon-rank"></i> </el-tooltip> </div> </el-button> </el-button-group> </div> </el-col> <el-col :span="4"> </el-col> </el-row> <div class="main"> <div class="conter"> <el-row :gutter="10" > <el-col v-for="(n,index) in fornum" :xs="24" :sm="24" :md="clonum" :lg="clonum" :xl="clonum" :key="index" > <div class="player-wrapper" element-loading-text="加载中..." element-loading-background="#000"> <div class="video-wrapper" :id="`videoid${n}`"> <div class="video-inner live hide-waiting" style=""> <div class="alt" :class="selectedindex === index? 'altChange' :'alt'" @click="getVideo(index, item)"> <div class="talbetop"> <div style="" class="video"> <ali-player @play="play($event)" class='aliPlayer' :useFlashPrism="true" :autoplay="true" :isLive="true" :rePlay="false" :showBuffer="true" showBarTime="5000" width="100%" height="100%" controlBarVisibility="hover" source="rtmp://124.139.232.61:1935/live/livestream" > </ali-player> </div> <div class="operate"> <div class="close-video"> <svg class="svg-icon" style="width:24px; height:24px; margin-top:-0.05rem;left:40;vertical-align: middle; fill:#52C41B"> <use xlink:href="#close"></use> </svg> </div> <div class="operate-button"> <div class="button-option"> <el-select v-model="value" placeholder="请选择"> <el-option v-for="item in optionValue" :key="item.value" :label="item.label" :value="item.value"> </el-option> </el-select> </div> <div class="button-right"> <svg class="camera-icon" style="width:24px; height:24px; margin-top:-0.05rem;left:40;vertical-align: middle; fill:#52C41B"> <use xlink:href="#camera 2"></use> </svg> <svg class="voice-icon" style="width:24px; height:24px; margin-top:-0.05rem;left:40;vertical-align: middle; fill:#52C41B"> <use xlink:href="#voice"></use> </svg> <svg class="fullscreen-icon" style="width:24px; height:24px; margin-top:-0.05rem;left:40;vertical-align: middle; fill:#52C41B"> <use xlink:href="#ic_fullscreen"></use> </svg> </div> </div> </div> <table> <tr> <td>无信号</td> </tr> </table> <div v-show="true" class="selectchannel" @click="dialogFormVisible=true"> 选择通道</div> </div> </div> </div> </div> </div> </el-col> </el-row> </div> <div class="footer"></div> </div> <el-dialog title="收货地址" :visible.sync="dialogFormVisible"> 这是测试 <div slot="footer" class="dialog-footer"> <el-button @click="dialogFormVisible = false">取 消</el-button> <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button> </div> </el-dialog> </div> </template> <script> import aliplayer from "@/components/public/AliPlayer.vue" export default { components: { "ali-player": aliplayer, }, data () { return { fullscreen: false, selectedindex:'', fornum:4, clonum:12, dialogFormVisible:false, videoclass:"padding-bottom: 4px; position: relative; margin: 0px auto;", classtype1:'', classtype2:'primary', classtype3:'', classtype4:'', items:[false,false,false,false], optionValue:[ { value: '1', label: '实时视频' }, { value: '2', label: '安全帽检测' }, { value: '3', label: '火苗检测' }, { value: '4', label: '离岗检测' } ], value:'1' , } }, created(){ let that = this window.onresize = function(){ if(!that.checkFull()){ // alert(that.videoclass) // 退出全屏后要执行的动作 console.log("退出全屏") that.fullscreen = false; //alert(that.fornum) for(let n=1;n<=that.fornum;n++){ //alert('videoid'+n) // alert(document.getElementById('videoid'+n)) document.getElementById('videoid'+n).style = "padding-bottom: 40.25%; position: relative; margin: 0px auto;"; } // that.videoclass="padding-bottom: 43.25%; position: relative; margin: 0px auto; overflow: hidden;", //document.getElementById('videoid1').style = "padding-bottom: 42.25%; position: relative; margin: 0px auto; overflow: hidden;"; // document.getElementById('videoid2').style = "padding-bottom: 42.25%; position: relative; margin: 0px auto; overflow: hidden;"; // document.getElementById('videoid3').style = "padding-bottom: 42.25%; position: relative; margin: 0px auto; overflow: hidden;"; //document.getElementById('videoid4').style = "padding-bottom: 42.25%; position: relative; margin: 0px auto; overflow: hidden;"; // that.tableclass="table-c" } else{ for(let n=1;n<=that.fornum;n++){ // alert('videoid'+n) // alert(document.getElementById('videoid'+n)) document.getElementById('videoid'+n).style = "padding-bottom: 52.25%; position: relative; margin: 0px auto;"; } //document.getElementById('videoid1').style='padding-bottom: 54.25%; position: relative; margin: 0px auto; overflow: hidden;'; //document.getElementById('videoid2').style='padding-bottom: 54.25%; position: relative; margin: 0px auto; overflow: hidden;'; //document.getElementById('videoid3').style='padding-bottom: 54.25%; position: relative; margin: 0px auto; overflow: hidden;'; //document.getElementById('videoid4').style='padding-bottom: 54.25%; position: relative; margin: 0px auto; overflow: hidden;'; } } }, methods:{ //选中 getVideo(index, item){ this.selectedindex=index }, showselect(item1){ this.items=[]; // alert(this.items.length) for(let i=0;i<this.fornum;i++){ if(item1==i){ // alert(item1) this.items[i] = true; }else{ this.items[i]=false; } } }, selecttype(item,fnum,clo) { // alert( this.items[0]) this.items=[]; for(let i=0;i<fnum;i++){ this.items[i]=false; } this.fornum = fnum; this.clonum = clo; if(item==='classtype1'){ this.classtype1='primary' this.classtype2='' this.classtype3='' this.classtype4='' } else if(item==='classtype2'){ this.classtype1='' this.classtype2='primary' this.classtype3='' this.classtype4='' } else if(item==='classtype3'){ this.classtype1='' this.classtype2='' this.classtype3='primary' this.classtype4='' } else if(item==='classtype4'){ this.classtype1='' this.classtype2='' this.classtype3='' this.classtype4='primary' } }, checkFull(){ //判断浏览器是否处于全屏状态 (需要考虑兼容问题) //火狐浏览器 var isFull = document.mozFullScreen|| document.fullScreen || //谷歌浏览器及Webkit内核浏览器 document.webkitIsFullScreen || document.webkitRequestFullScreen || document.mozRequestFullScreen || document.msFullscreenEnabled if(isFull === undefined) { isFull = false } return isFull; }, // 全屏事件 handleFullScreen(){ let element = document.documentElement; let that=this; // alert(this.fullscreen) if (this.fullscreen) { if (document.exitFullscreen) { document.exitFullscreen(); } else if (document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if (document.msExitFullscreen) { document.msExitFullscreen(); } // alert("ddd") //that.videoclass='padding-bottom: 42.25%; position: relative; margin: 0px auto; overflow: hidden;'; } else { if (element.requestFullscreen) { element.requestFullscreen(); } else if (element.webkitRequestFullScreen) { element.webkitRequestFullScreen(); } else if (element.mozRequestFullScreen) { element.mozRequestFullScreen(); } else if (element.msRequestFullscreen) { // IE11 element.msRequestFullscreen(); } // this.videoclass=''; // this.tableclass='table-c' //this.tableclass='alt' } this.fullscreen = !this.fullscreen; } } } </script> <style lang="scss"> body { overflow-x: hidden; /* overflow-y: hidden; */ } .main{ padding: 10px; width: auto; height: 100%; .el-row { // margin-bottom: 20px!important; } } html,body{ height:100% ;margin:0; overflow-x: hidden; } .video-wrapper{ height:auto !important; margin:0; padding-bottom: 0.05%!important; position: relative; margin: 0px auto; // position: relative; top: 0px; bottom: 0px; left: 0px; right: 0px; } .alt { // display: grid; // grid-template-columns: repeat(auto-fit, 48%); // grid-template-rows: repeat(2,160px); grid-gap: 10px 10px; // position: absolute; // margin-bottom: 5px!important; // left: 0; // top: 0; // right: 0; // bottom: 0; background: #000; color: #fff; text-align: center; } .altChange { // justify-content:center; // position: absolute; // left: 0; // top: 0; // right: 0; // bottom: 0; // background: #000; border: 2px solid #00A4FF; box-sizing: border-box; color: #fff; // text-align: center; } .alt table{ width: 100%; height: 100%; } .talbetop{ width: 100%; height: 100%; position:relative; .video{ position: relative; display: grid; // grid-template-columns: repeat(auto-fit, 48%); // grid-template-rows: repeat(2,160px); // grid-gap: 10px 10px; width: 100%; height: 3rem; // position: absolute; // left: 0; // top: 0; // right: 0; // bottom: 0; // background: red; z-index: 1000; .aliPlayer{ width: 100%; height: 100%; // margin-bottom: 10px!important; } } .operate{ .close-video{ position: absolute; top:0; right: 0; } .operate-button{ display: flex; justify-content: space-between; position: absolute; bottom: 0; left:0; width: 100%; background: rgba(#eee,0.1); z-index: 1000000; height: 0.4rem; line-height:0.4rem; .button-option{ width: 1.2rem; height: 0.3rem; line-height:0.3rem; .el-input__inner { -webkit-appearance: none; background-color: #FFF; background-image: none; border-radius: 4px; border: 1px solid #DCDFE6; -webkit-box-sizing: border-box; box-sizing: border-box; color: #606266; display: inline-block; font-size: inherit; height: 30px; line-height: 30px; outline: 0; // padding: 0 15px; -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1); transition: border-color .2s cubic-bezier(.645,.045,.355,1); width: 100%; } .option-select{ box-sizing: border-box; } } .button-right{ svg{ margin-right: 0.2rem; } } } } } .selectchannel{ position:absolute;right:5px;top:5px; z-index: 10000; } .video-close { // position: absolute; // top: 5px; // right: 5px; color: #fff; font-size: 12px; background-color: hsla(0,0%,50%,.5); padding: 2px 5px; cursor: pointer; border-radius: 2px; max-width: 120px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .table-c table{border-right:2px solid #fff;border-bottom:2px solid #fff;} .table-c table td{border-left:2px solid #fff;border-top:2px solid #fff} /* css 注释: 只对table td设置左与上边框; 对table设置右与下边框; 为了便于截图,我们将css 注释说明换行排版 */ .player-wrapper{ padding-bottom: 5px; } .footer{ background: #000; height: 10%; } </style> ```

百度App浏览器下,vue-router的返回上一页this.$router.go(-1)无效

百度App浏览器下,vue-router的返回上一页this.$router.go(-1)无效,无论是history还是hash模式都不起作用,请问这个是咋回事? 百度图标:![图片说明](https://img-ask.csdn.net/upload/201806/29/1530241571_756667.png)

怎么让浏览器打开网页是极速模式?

在html里怎么写能让浏览器打开这个网页是极速模式。改成兼容模式后,刷新网页还是能变回极速

fireFox下怎么判断是刷新还是关闭浏览器

这里说的关闭浏览器是,就是鼠标右键关闭,或者是点右上角的小叉子关闭。 以下是我在IE中 判断浏览器关闭或者刷新的方法 function unloadDestorySession(event) { event = (event)?event:window.event; if (event.clientX < 0 && event.clientY < 0 || event.altKey) { alert("关闭"); } } else { alert("刷新"); } } <body onunload="unloadDestorySession()"> 在ie里一切正常,但是在firefox里面是没有办法执行的,我尝试了很多方法去解决这个问题,但是还是没办法。 希望有高人能解决这个问题,因为我在做一个实时聊天的应用,要监听实时在线的用户。关闭浏览器时,要销毁对应的session,要更新在线用户。 要求必须能在firefox下实现和上面程序一样的功能。 [b]问题补充:[/b] 首先感谢yourgame的回答,但是我想你误解我的意思了。 用户退出分为正常退出和非正常退出两种,我问这个问题就是为了处理非正常退出时的情况,比如:用户经常会不点退出按钮,而是直接点右键关闭,或者用Alt+F4,或者直接点右上角的叉叉关闭。 非正常关闭的用户,应该视为下线用户 我提问这个问题就是要在用户非正常关闭时,销毁相应的session,更新在线用户列表,并且给其他用户浏览器推入新的用户列表。 这个应经在IE下实现了,但是火狐不支持window.event事件,我实在处理不了 [b]问题补充:[/b] yourgame 说: 首先,你这种做法就不正确。你不能通过onunload 来检测用户是否已经离线。 yourgame ,我说一下我是怎么做的在线用户。 我用了一个单例的List,用来存放在线用户,用户上线时,获得这个单例的实例,list.add(user),这里的User是一个pojo,代码如下: package com.yunfei.pojo; import java.io.Serializable; import javax.servlet.http.HttpSessionBindingEvent; import javax.servlet.http.HttpSessionBindingListener; @SuppressWarnings("serial") public class User implements HttpSessionBindingListener, Serializable { private static final long serialVersionUID = 1549880235571202091L; private int id; private String username; private String password; private String sessionid; private User u; public User getU() { return u; } public void setU(User u) { this.u = u; } public int getId() { return id; } public void setId(int id) { this.id = id; } public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } public String getPassword() { return password; } public void setPassword(String password) { this.password = password; } private UserList userList = UserList.getInstance(); public void valueBound(HttpSessionBindingEvent e) { System.out.println("==================================执行了valueBound"); System.out.println("addUser: " + u.getUsername()); userList.addUser(u); System.out.println(userList.getList()); } public void valueUnbound(HttpSessionBindingEvent e) { System.out.println("==================================执行了valueUnBound"); System.out.println("RemoveUser: " + u.getUsername()); userList.removeUser(u); System.out.println(userList.getList()); } public String getSessionid() { return sessionid; } public void setSessionid(String sessionid) { this.sessionid = sessionid; } } 用户登陆时,新创建session,并且给User u,这个属性调用set方法,这样就会调用valueBound,单例userList就会增加一个新用户。然后把这个userList推入所有用户的浏览器中。退出时(正常退出就不说了),用户不点退出按钮,直接关闭浏览器,也视为退出, 用onunload就是为了在用户非正常退出时,触发一个事件,来从单例userList中remove这个用户,并且给其他用户浏览器推入新用户列表。但是刷新时,这些是不能被执行的。 这些功能在IE下都实现了,但是在火狐里由于window.event事件不兼容,我试验了不少方法,还是没有办法判断刷新,退出 [b]问题补充:[/b] yourgame,你提供的思路倒是也可以考虑一下,但是服务器定期推消息怎么实现啊?我想了下好像没有类似的调用方法。可以提供一个例子吗?谢谢了。 ScriptSession这个对象只要刷新一下浏览器就会新增加一个,我后来解决了这个问题,就是用一个map来存放在线用户对应的ScriptSession,用户刷新和关闭浏览器的时候,也会更新或者删除对应的ScriptSession; [b]问题补充:[/b] 还是比较期待有高人能解决这个问题, function unloadDestorySession(event) { event = (event)?event:window.event; if (event.clientX < 0 && event.clientY < 0 || event.altKey) { alert("关闭"); } } else { alert("刷新"); } } <body onunload="unloadDestorySession()"> 能在firefox下实现同样的功能。

IE11 使用window.location.href无法跳转

做了一个登陆界面,使用的是js,验证成功后执行跳转语句 var addr = "/Web_Newsrelease/News/NewsList"; window.location.href = addr; 但是使用IE11不会执行跳转,地址栏显示为http://home.XXX.com/Web_Newsrelease/User/Login?ReturnUrl=%2fWeb_Newsrelease%2fNews%2fNewsList 但是使用IE8、谷歌、火狐都没有问题

Ie 下.html() 报错

我想使用 .html() 获取 xml 对象中的数据,Chrome 这些都可以可以使用,但是在 ie 中报错 无法获取未定义或 null 引用的属性“replace”

技术大佬:我去,你写的 switch 语句也太老土了吧

昨天早上通过远程的方式 review 了两名新来同事的代码,大部分代码都写得很漂亮,严谨的同时注释也很到位,这令我非常满意。但当我看到他们当中有一个人写的 switch 语句时,还是忍不住破口大骂:“我擦,小王,你丫写的 switch 语句也太老土了吧!” 来看看小王写的代码吧,看完不要骂我装逼啊。 private static String createPlayer(PlayerTypes p...

副业收入是我做程序媛的3倍,工作外的B面人生是怎样的?

提到“程序员”,多数人脑海里首先想到的大约是:为人木讷、薪水超高、工作枯燥…… 然而,当离开工作岗位,撕去层层标签,脱下“程序员”这身外套,有的人生动又有趣,马上展现出了完全不同的A/B面人生! 不论是简单的爱好,还是正经的副业,他们都干得同样出色。偶尔,还能和程序员的特质结合,产生奇妙的“化学反应”。 @Charlotte:平日素颜示人,周末美妆博主 大家都以为程序媛也个个不修边幅,但我们也许...

CSDN:因博主近期注重写专栏文章(已超过150篇),订阅博主专栏人数在突增,近期很有可能提高专栏价格(已订阅的不受影响),提前声明,敬请理解!

CSDN:因博主近期注重写专栏文章(已超过150篇),订阅博主专栏人数在突增,近期很有可能提高专栏价格(已订阅的不受影响),提前声明,敬请理解! 目录 博客声明 大数据了解博主粉丝 博主的粉丝群体画像 粉丝群体性别比例、年龄分布 粉丝群体学历分布、职业分布、行业分布 国内、国外粉丝群体地域分布 博主的近期访问每日增量、粉丝每日增量 博客声明 因近期博主写专栏的文章越来越多,也越来越精细,逐步优化文章。因此,最近一段时间,订阅博主专栏的人数增长也非常快,并且专栏价

我说我不会算法,阿里把我挂了。

不说了,字节跳动也反手把我挂了。

培训班出来的人后来都怎么样了?(二)

接着上回说,培训班学习生涯结束了。后面每天就是无休止的背面试题,不是没有头脑的背,培训公司还是有方法的,现在回想当时背的面试题好像都用上了,也被问到了。回头找找面试题,当时都是打印下来天天看,天天背。 不理解呢也要背,面试造飞机,上班拧螺丝。班里的同学开始四处投简历面试了,很快就有面试成功的,刚开始一个,然后越来越多。不知道是什么原因,尝到胜利果实的童鞋,不满足于自己通过的公司,嫌薪水要少了,选择...

面试了一个 31 岁程序员,让我有所触动,30岁以上的程序员该何去何从?

最近面试了一个31岁8年经验的程序猿,让我有点感慨,大龄程序猿该何去何从。

大三实习生,字节跳动面经分享,已拿Offer

说实话,自己的算法,我一个不会,太难了吧

程序员垃圾简历长什么样?

已经连续五年参加大厂校招、社招的技术面试工作,简历看的不下于万份 这篇文章会用实例告诉你,什么是差的程序员简历! 疫情快要结束了,各个公司也都开始春招了,作为即将红遍大江南北的新晋UP主,那当然要为小伙伴们做点事(手动狗头)。 就在公众号里公开征简历,义务帮大家看,并一一点评。《启舰:春招在即,义务帮大家看看简历吧》 一石激起千层浪,三天收到两百多封简历。 花光了两个星期的所有空闲时...

工作八年,月薪60K,裸辞两个月,投简历投到怀疑人生!

近日,有网友在某职场社交平台吐槽,自己裸辞两个月了,但是找工作却让自己的心态都要崩溃了,全部无果,不是已查看无回音,就是已查看不符合。 “工作八年,两年一跳,裸辞两个月了,之前月薪60K,最近找工作找的心态崩了!所有招聘工具都用了,全部无果,不是已查看无回音,就是已查看不符合。进头条,滴滴之类的大厂很难吗???!!!投简历投的开始怀疑人生了!希望 可以收到大厂offer” 先来看看网...

97年世界黑客编程大赛冠军作品(大小仅为16KB),惊艳世界的编程巨作

这是世界编程大赛第一名作品(97年Mekka ’97 4K Intro比赛)汇编语言所写。 整个文件只有4095个字节, 大小仅仅为16KB! 不仅实现了3D动画的效果!还有一段震撼人心的背景音乐!!! 内容无法以言语形容,实在太强大! 下面是代码,具体操作看最后! @echo off more +1 %~s0|debug e100 33 f6 bf 0 20 b5 10 f3 a5...

不要再到处使用 === 了

我们知道现在的开发人员都使用 === 来代替 ==,为什么呢?我在网上看到的大多数教程都认为,要预测 JavaScript 强制转换是如何工作这太复杂了,因此建议总是使用===。这些都...

什么是a站、b站、c站、d站、e站、f站、g站、h站、i站、j站、k站、l站、m站、n站?00后的世界我不懂!

A站 AcFun弹幕视频网,简称“A站”,成立于2007年6月,取意于Anime Comic Fun,是中国大陆第一家弹幕视频网站。A站以视频为载体,逐步发展出基于原生内容二次创作的完整生态,拥有高质量互动弹幕,是中国弹幕文化的发源地;拥有大量超粘性的用户群体,产生输出了金坷垃、鬼畜全明星、我的滑板鞋、小苹果等大量网络流行文化,也是中国二次元文化的发源地。 B站 全称“哔哩哔哩(bilibili...

终于,月薪过5万了!

来看几个问题想不想月薪超过5万?想不想进入公司架构组?想不想成为项目组的负责人?想不想成为spring的高手,超越99%的对手?那么本文内容是你必须要掌握的。本文主要详解bean的生命...

MySQL性能优化(五):为什么查询速度这么慢

前期回顾: MySQL性能优化(一):MySQL架构与核心问题 MySQL性能优化(二):选择优化的数据类型 MySQL性能优化(三):深入理解索引的这点事 MySQL性能优化(四):如何高效正确的使用索引 前面章节我们介绍了如何选择优化的数据类型、如何高效的使用索引,这些对于高性能的MySQL来说是必不可少的。但这些还完全不够,还需要合理的设计查询。如果查询写的很糟糕,即使表结构再合理、索引再...

用了这个 IDE 插件,5分钟解决前后端联调!

点击上方蓝色“程序猿DD”,选择“设为星标”回复“资源”获取独家整理的学习资料!作者 |李海庆我是一个 Web 开发前端工程师,受到疫情影响,今天是我在家办公的第78天。开发了两周,...

大厂的 404 页面都长啥样?最后一个笑了...

每天浏览各大网站,难免会碰到404页面啊。你注意过404页面么?猿妹搜罗来了下面这些知名网站的404页面,以供大家欣赏,看看哪个网站更有创意: 正在上传…重新上传取消 腾讯 正在上传…重新上传取消 网易 淘宝 百度 新浪微博 正在上传…重新上传取消 新浪 京东 优酷 腾讯视频 搜...

【高并发】高并发秒杀系统架构解密,不是所有的秒杀都是秒杀!

网上很多的文章和帖子中在介绍秒杀系统时,说是在下单时使用异步削峰来进行一些限流操作,那都是在扯淡! 因为下单操作在整个秒杀系统的流程中属于比较靠后的操作了,限流操作一定要前置处理,在秒杀业务后面的流程中做限流操作是没啥卵用的。

自从喜欢上了B站这12个UP主,我越来越觉得自己是个废柴了!

不怕告诉你,我自从喜欢上了这12个UP主,哔哩哔哩成为了我手机上最耗电的软件,几乎每天都会看,可是吧,看的越多,我就越觉得自己是个废柴,唉,老天不公啊,不信你看看…… 间接性踌躇满志,持续性混吃等死,都是因为你们……但是,自己的学习力在慢慢变强,这是不容忽视的,推荐给你们! 都说B站是个宝,可是有人不会挖啊,没事,今天咱挖好的送你一箩筐,首先啊,我在B站上最喜欢看这个家伙的视频了,为啥 ,咱撇...

代码注释如此沙雕,会玩还是你们程序员!

某站后端代码被“开源”,同时刷遍全网的,还有代码里的那些神注释。 我们这才知道,原来程序员个个都是段子手;这么多年来,我们也走过了他们的无数套路… 首先,产品经理,是永远永远吐槽不完的!网友的评论也非常扎心,说看这些代码就像在阅读程序员的日记,每一页都写满了对产品经理的恨。 然后,也要发出直击灵魂的质问:你是尊贵的付费大会员吗? 这不禁让人想起之前某音乐app的穷逼Vip,果然,穷逼在哪里都是...

Java14 新特性解读

Java14 已于 2020 年 3 月 17 号发布,官方特性解读在这里:https://openjdk.java.net/projects/jdk/14/以下是个人对于特性的中文式...

爬虫(101)爬点重口味的

小弟最近在学校无聊的很哪,浏览网页突然看到一张图片,都快流鼻血。。。然后小弟冥思苦想,得干一点有趣的事情python 爬虫库安装https://s.taobao.com/api?_ks...

疫情后北上广深租房价格跌了吗? | Alfred数据室

去年3月份我们发布了《北上广深租房图鉴》(点击阅读),细数了北上广深租房的各种因素对租房价格的影响。一年过去了,在面临新冠疫情的后续影响、城市尚未完全恢复正常运转、学校还没开学等情况下...

面试官给我挖坑:a[i][j] 和 a[j][i] 有什么区别?

点击上方“朱小厮的博客”,选择“设为星标”后台回复&#34;1024&#34;领取公众号专属资料本文以一个简单的程序开头——数组赋值:int LEN = 10000; int[][] ...

又一起程序员被抓事件

就在昨天互联网又发生一起让人心酸的程序员犯罪事件,著名的百度不限速下载软件 Pandownload PC 版作者被警方抓获。案件大致是这样的:软件的作者不仅非法盗取用户数据,还在QQ群进...

应聘3万的职位,有必要这么刁难我么。。。沙雕。。。

又一次被面试官带到坑里面了。面试官:springmvc用过么?我:用过啊,经常用呢面试官:springmvc中为什么需要用父子容器?我:嗯。。。没听明白你说的什么。面试官:就是contr...

太狠了,疫情期间面试,一个问题砍了我5000!

疫情期间找工作确实有点难度,想拿到满意的薪资,确实要点实力啊!面试官:Spring中的@Value用过么,介绍一下我:@Value可以标注在字段上面,可以将外部配置文件中的数据,比如可以...

Intellij IDEA 美化指南

经常有人问我,你的 IDEA 配色哪里搞的,我会告诉他我自己改的。作为生产力工具,不但要顺手而且更要顺眼。这样才能快乐编码,甚至降低 BUG 率。上次分享了一些 IDEA 有用的插件,反...

【相亲】96年程序员小哥第一次相亲,还没开始就结束了

颜值有点高,条件有点好

太厉害了,终于有人能把TCP/IP 协议讲的明明白白了

一图看完本文 一、 计算机网络体系结构分层 计算机网络体系结构分层 计算机网络体系结构分层 不难看出,TCP/IP 与 OSI 在分层模块上稍有区别。OSI 参考模型注重“通信协议必要的功能是什么”,而 TCP/IP 则更强调“在计算机上实现协议应该开发哪种程序”。 二、 TCP/IP 基础 1. TCP/IP 的具体含义 从字面意义上讲,有人可能会认为...

腾讯面试题: 百度搜索为什么那么快?

我还记得去年面腾讯时,面试官最后一个问题是:百度/google的搜索为什么那么快? 这个问题我懵了,我从来没想过,搜素引擎的原理是什么 然后我回答:百度爬取了各个网站的信息,然后进行排序,当输入关键词的时候进行文档比对……巴拉巴拉 面试官:这不是我想要的答案 我内心 这个问题我一直耿耿于怀,终于今天,我把他写出来,以后再问,我直接把这篇文章甩给他!!! 两个字:倒排,将贯穿整篇文章,也是面试官...

相关热词 c#跨线程停止timer c#批量写入sql数据库 c# 自动安装浏览器 c#语言基础考试题 c# 偏移量打印是什么 c# 绘制曲线图 c#框体中的退出函数 c# 按钮透明背景 c# idl 混编出错 c#在位置0处没有任何行
立即提问