我的 application 中有以下对话框:
当用户按下添加 Logo
按钮时,会发生以下情况:
- 应该会弹出一个文件选择对话框。
- 用户选择文件后,应调用一个函数(这将更新图像)。
我有以下代码。 markup文件选择如下所示:
<button class="btn" ng-click="$ctrl.addLogo()">Add logo</button>
$ctrl.addLogo()
定义为 ( source )
$ctrl.addLogo = function() {
console.log("'Add logo' button clicked");
var uploadForm = document.createElement('form');
var fileInput = uploadForm.appendChild(document.createElement('input'));
fileInput.type = 'file';
fileInput.name = 'images';
fileInput.multiple = true;
fileInput.click(function() {
console.log("Click callback called");
});
};
当我按下添加 Logo
按钮时,文件选择对话框会打开,但调用的单击回调
消息不会出现在控制台中。这意味着我无法检测用户何时选择了文件(或通过“取消”关闭了对话框)。
如何对用户选择文件(或取消对话框)使用react?
最佳答案
当用户使用 type="file"
在 input
中选择文件时,会触发 change
事件。
如果您将 click
监听器替换为 change
监听器,它应该可以工作:)
fileInput.click(function() {
console.log("Click callback called");
});
必须成为:
fileInput.change(function() {
console.log("Click callback called");
});
关于javascript - 如何捕获 "file selected"事件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50085609/