以编程方式获取输入文件类型的结果（文件路径）

Question

我有一个超链接，当单击成功时会显示​​一个文件选择对话框。我没有显示<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names.." title="Type in a name"> <ul id="myUL" style="list-style: none;"> <li><p href="#">Adele</p></li> <li><p href="#">Agnes</p></li> <li><p href="#">Billy</p></li> <li><p href="#">Bob</p></li> <li><p href="#">Calvin</p></li> <li><p href="#">Christina</p></li> <li><p href="#">Cindy</p></li> </ul>标签。

input方法立即返回。用户对话框关闭后，如何点击OK事件。我不想使用click()按钮。

代码：

Submit

JavaScript代码为：

<p>Please select an image:</p>
<p><a href="JavaScript:DoImageAdd();">add</a></p>
<input id="pic" type="file" name="pic" size="40" accept="image/png, image/jpeg, image/jpg" style="display:none">

问题在于function DoImageAdd() { document.getElementById('pic').click(); //var pathImage = document.getElementById('pic').value; //if (pathImage) // alert(pathImage); //else // alert("No file selected. Request cancelled."); }之后的行会立即执行，这很有意义。

我尝试了以下代码，但这没用。

.click()

执行方法：

1. 用户点击超链接
2. 然后用户选择一张图片
3. 然后，用户会看到一个带有所选图像路径的消息框，或者一条消息，表明用户取消了该请求，可能是返回时的空文件路径。

这里是该项目的匿名小提琴。

project code

我需要另一段代码，可以利用某种完成事件。只是我不知道那是什么。

有想法吗？

更新

摆弄有效答案：

with working answer