如何使照片作为< input type =" file">？ [英] How to make photo to function as <input type = "file">?
问题描述
当点击默认照片时，它应该让用户从他的计算机中选择一个文件，而不是使输入类型=文件使用户成为第一个单击浏览按钮而不是选择文件。用户应直接点击默认照片，并出现文件选择窗口。
When the default photo is clicked it should make a user to select a file from his computer other than making an input type = "file" that makes the user to first click on browse button than select a file. A user should directly click on default photo and a file selection window should appear.
<html lang = "en">
<head>
<title>
Profile Click
</title>
<style>
#file{
display: none;
}
</style>
</head>
<body>
<script>
function pro1(){
document.prolis.getElementById("image") = document.prolis.getElementById("file");
}
</script>
<form name = "prolis">
<img src = "index.jpg" id = "image" onclick = "pro1()";>
<input type = "file" id = "file">
</body>
</html>
Mozilla Firefox console shows "TypeError: document.prolis.getElementById is not a function".
我应该如何使这个功能起作用？
这是我的默认图片：
How should I make this function work? This is my default image:
推荐答案
要使图像表现得像输入文件元素，你点击 img <只需调用输入文件 .click（）方法/ code>。
To make the image behave like an input file element, you can just call the input file .click() method when you click on the img.
这是你的代码应该如何：
This is how should be your code:
function pro1(){
document.getElementById("file").click();
}
演示：
<html lang = "en">
<head>
<title>
Profile Click
</title>
<style>
#file{
display: none;
}
</style>
</head>
<body>
<script>
function pro1(){
document.getElementById("file").click();
}
</script>
<form name = "prolis">
<img src = "index.jpg" id = "image" onclick = "pro1()";>
<input type = "file" id = "file">
</body>
</html>
注意：
您只需使用 document.getElementById（file）即可访问元素由 id 。
You just need to use document.getElementById("file") to access an element by its id.
这篇关于如何使照片作为< input type =" file">？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
