html页面加载完成后想直接弹出上传窗口
alert有警告,但上传按钮没反应
$(window).load(function(){
alert("页面加载完成");
$("#file").click();
})
浏览器不支持这种做法,必须是用户主动去触发这个按钮才会弹出上传框,否则不会执行该操作
现在浏览器限制了,这种input的需要用户手动来点击
可以试着用弹窗,可以拖进去的那种,比如element-ui的那种来实现
上传按钮在等alert呀
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script
crossorigin="anonymous"
integrity="sha384-KcyRSlC9FQog/lJsT+QA8AUIFBgnwKM7bxm7/YaX+NTr4D00npYawrX0h+oXI3a2"
src="https://lib.baomitu.com/jquery/1.12.4/jquery.js"
></script>
</head>
<style>
#file {
width: 100%;
height: 100%;
opacity: 0;
position: absolute;
left: 0;
top: 0;
}
.box {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100px;
display: none;
}
.box-content {
position: absolute;
width: 100px;
height: 40px;
background-color: #f00;
top: 20%;
left: 50%;
margin-left: -20px;
text-align: center;
line-height: 40px;
}
</style>
<body>
<div class="box">
<div class="box-content">页面加载完成 <input type="file" id="file" name="file" /></div>
</div>
<script>
$(window).load(function () {
// alert("页面加载完成");
$(".box").toggle();
$('.box-content').click(()=>{
$('.box-content').hide()
})
});
</script>
</body>
</html>
原生input得用户自己手动触发才可以执行