Question

我的页面上有一个div，它有一个图像标记和输入类型作为文件。我想要做的是，当我选择图像时，我会在文本框中选择按钮，然后选择按钮。我想把它作为图像源的路径。

<!DOCTYPE html>
<html>
<head>
<script>
function load()
{
    var  path = document.getElementById('image').value;
    var newpath="file:///" + path;
    document.getElementById('image').src = newpath;

}
</script>
</head>
<body>
<div style="height:300px; width:300px; border:1px solid red;">
<img id="1" src="load()" height="300" width="300">
</div>
<form action="demo_form.asp">
  Select a file: <input type="file" id="image" onclick="load()" >
                 <input type=submit onclick="load()">
</form>

</body>
</html>

Answer 1

您无法使用代码修改文件输入的值，因为这意味着任何人都可以强制您发送计算机上的任何文件而不是您选择的文件。

要实现这一点，您唯一的方法是隐藏文件输入中的文本框并创建一个可以控制的新文本框。

<input id="txtNewPath" type="text" />

然后

function load() {
    var path = document.getElementById('image').value;
    var newpath="file:///" + path;
    document.getElementById('txtNewPath').value = newpath;
}

Answer 2

我认为你的问题就在这一行：

document.getElementById('image').src = newpath;

将其更改为指向img标记：

document.getElementById('1').src = newpath;

文件类型值作为图像源

2 个答案: