HTML5显示为图像而不是"选择文件"按钮
我一直在研究如何使用HTML5
然而，我能找到的显示“拍照”选项的唯一方法是通过一个文本字段，该字段中有一个名为“选择文件”的按钮
有没有一种方法可以点击现有图像打开拍照选项，然后在用户选择照片/文件后显示新图像而不是现有图像？如果他们乐意保存图像，他们应该点击“上传”按钮。
看看这里的JS小提琴，希望这有点道理！http://jsfiddle.net/6dxGY/
共有3个答案
对于那些需要输入文件直接打开相机的人，只需在输入文件中声明capture参数，如下所示：
<代码>
我知道这是一个老问题，但我在试图解决同样的问题时遇到了它。我认为值得分享这个我在其他地方没有找到的解决方案。
基本上，解决方案是使用CSS隐藏
我之前使用过JavaScript解决方案，效果也很好，但只使用CSS就可以解决“演示”问题。
label.cameraButton {
display: inline-block;
margin: 1em 0;
/* Styles to make it look like a button */
padding: 0.5em;
border: 2px solid #666;
border-color: #EEE #CCC #CCC #EEE;
background-color: #DDD;
}
/* Look like a clicked/depressed button */
label.cameraButton:active {
border-color: #CCC #EEE #EEE #CCC;
}
/* This is the part that actually hides the 'Choose file' text box for camera inputs */
label.cameraButton input[accept*="camera"] {
display: none;
}<!DOCTYPE html>
<html>
<head>
<title>Nice image capture button</title>
</head>
<body>
<label class="cameraButton">Take a picture
<input type="file" accept="image/*;capture=camera">
</label>
</body>
</html>
为此，必须使用Javascript文件阅读器。（filereader api简介：http://www.html5rocks.com/en/tutorials/file/dndfiles/)
一旦用户选择了一个图像，你就可以读取所选图像的文件路径并将其放入你的html中。
例子：
<form id="form1" runat="server">
<input type='file' id="imgInp" />
<img id="blah" src="#" alt="your image" />
</form>
JavaScript：
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#blah').attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
$("#imgInp").change(function(){
readURL(this);
});
-
问题内容： 我有一个表格可以 浏览并选择一个文件。 我要做的是在选择图像后立即显示该图像。而且这是在按下表单上的“提交”按钮之前，因此图像几乎可以肯定位于客户端。能做到吗？ 问题答案： 干得好： HTML 脚本：
-
此表单在基于函数的视图中显示单选按钮，但在我引入基于类的视图时更改为复选框，有什么解决办法。我希望他们再次显示单选按钮 表单.py models.py 模板 views.py
-
我正在创建教师表单，我想从图库中选择图像作为个人资料，我想用“选择图像”的标签更改右侧“选择图像按钮”的标签和位置 这是html 这是Css
-
我想显示一个包含文本和图像的列表。我能够做到这一点，但选择模型很时髦。当我用鼠标选择列表中的项目时，似乎选择了整个列表视图元素。当我使用箭头键时，选择模型工作正常。 在我的控制器中，我有
-
我有一个表单，在那里，我想使用图像而不是单选按钮。我如何显示多个图像，而不是单选按钮。例如，性别与“男性” 但在这里，问题出现了，当我将输入id更改为其他名称时，它不起作用。有人能帮我吗，因为这是一个非常简单的方法，我想用这个。您可以将输入id更改为“visa1”，然后查看结果。
-
问题内容： 我正在编写一个快速脚本来动态生成绘图。我使用下面的代码（来自Matplotlib文档）作为起点： 我不想将图形显示在GUI上，而是要将图形保存到文件（例如foo.png）中，以便可以在批处理脚本中使用它。我怎么做？ 问题答案： 在回答问题后，我想在使用matplotlib.pyplot.savefig时添加一些有用的提示。文件格式可以通过扩展名指定： 将分别给出栅格化或矢量化的输出，这