如何捕获所选的＆＃34;文件＆＃34;事件？

Question

我的application中有以下对话框：

当用户按下Add logo按钮时，应该发生以下事情：

1. 应弹出文件选择对话框。
2. 用户选择文件后，应调用一个函数（将更新图像）。

我有以下代码。文件选择的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");
    });
};

当我按下Add logo按钮时，文件选择对话框确实打开，但Click callback called消息未出现在控制台中。这意味着我无法检测到用户何时选择了文件（或者使用＆＃34关闭对话框;取消＆＃34;）。

如何对用户选择文件（或取消对话框）实施反应？

Answer 1

当用户选择@Controller @RequestMapping("/admin") public class AdminController { @RequestMapping(method=RequestMethod.POST, value="/movies") @ResponseBody public String createMovie(String movie) { System.out.println("Adding movie!! "+movie); return "created"; } @RequestMapping(method=RequestMethod.GET, value="/movies") public String createMovieForm() { return "createMovieForm"; } } 中input的文件时，会触发type="file"个事件。

如果您用change侦听器替换click侦听器，它应该有效：）

change

必须成为：

fileInput.click(function() {
    console.log("Click callback called");
});