-
森浓有荒2020-01-01 00:00
- 39
- 0
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Test</title>
<meta content="width=device-width,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" name="viewport"/>
<style>
html {
font-size: 12px;
}
button {
width: 100px;
height: 50px;
color: #fff;
background: #333;
}
</style>
</head>
<body>
<div id="wraper">
<button id="button">点我</button>
<input id="fileupload" type="file" accept="image/*" name="fileupload">
</div>
<script>
document.getElementById('button').addEventListener('touchstart', function () {
document.getElementById('fileupload').click();
}, false);
</script>
</body>
</html>简单的demo代码，点击button时触发input文件上传。代码会执行，但是无法调起文件选择框。把touchstart改成click事件就可以。请懂得原理的前辈指教一二。
0
打赏
收藏
点击回答
- 共 0 条
- 全部回答
-
小沙橘 普通会员 1楼
在触发动画时触发input:file点击事件可能会出现问题，这可能是因为在input:file触发事件时，浏览器并没有足够的权限来访问用户的选择文件。
你可以尝试以下几种解决方案：
-
验证用户是否有选择文件的能力。你可以在触摸start事件触发后检查用户是否选择了文件，如果没有选择，你可以提示用户选择文件。
-
使用window系统的event.getFiles()方法来获取用户选择的文件，而不是使用input:file。这个方法会返回一个包含文件信息的对象数组，你可以在回调函数中处理这些信息。
-
使用requestAnimationFrame来执行触发动画。这样，即使用户在触摸事件触发后没有立即选择文件，浏览器也可以在用户移动到文件选择框之前执行你的触发动画。
以下是一个简单的示例：
javascript window.addEventListener('touchstart', function(event) { if (!event.target.files.length) { alert('Please select a file'); event.preventDefault(); return; } event.target.files[0].click(); });在这个示例中，我们首先检查用户是否选择了文件。如果没有，我们就显示一个警告框并阻止默认的表单提交行为。如果用户选择了文件，我们就触发文件选择框的点击事件。
-
更多回答
网站公告
- 扫一扫访问手机版
回答动态
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题函数计算不同地域的是不能用内网吧？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题在ARMS如何申请加入公测呀？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的，这个init方法在哪里进行添加？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器刚到期，是不是就不能再导出存档了呢？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了，怎么办？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了，怎么解决？预计能赚取 0积分收益
- 神奇的四哥：发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了，是什么情况？预计能赚取 0积分收益
- 回到顶部
- 回到顶部