javascript - 检测上传对话框中的打开按钮

Question

有没有办法检测是否使用 JavaScript 或查询单击了上传对话框中的打开按钮？

更新: 我将向您展示我的示例代码:

<input type = "file" name = "imgUpload" id = "trngImgUpload" style = "display : none;" multiple>
<button class="btnTools" onclick = "trngOpenVidUploadDialog()" ><img src ="@Url.Content("~/Images/video_icon.jpg")" class ="img3"/></button>
<script>
function trngOpenVidUploadDialog() {
        //$('#modalMatchingTypePairType').modal('hide');
        //console.log(123);
        $('#trngImgUpload').trigger("click");

    };
    $('input[type=file]').change(function () {
        if (this.files) {
            alert('changed');
            var path = sendVidFile($('#trngImgUpload')[0].files[0], 1);
            $('#page' + currId).append('<div class = "vidDR" id = "tTool' + (toolIdCounter) + '"><div class = "del"></div><embed autostart="false" class = "vid" src="' + path + '"></embed></div>');
            $('.vidDR').resizable({
                containment: '#page' + currId
            }).draggable({
                containment: '#page' + currId
            });
            $(".vidDR").click(function () {
                alert(1);
            });
            $('#trngImgUpload').val("");
            $('#tTool' + toolIdCounter).contextmenu(function () {
                $(this).remove();
            });
            toolIdCounter++;
        }
    });
</script>

我已经尝试使用更改事件，但没有任何反应。我不知道我的代码有什么问题。

Answer 1

您无法捕获“打开”按钮上的操作，但是您可以捕获文件输入发生更改时的操作。例如。当用户使用文件输入选择一个新文件时。

示例如下:

// input on change event listener
$('#file-upload').on('change', function() {
  alert('File Attached: ' + $('#file-upload').val());
});

<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- file upload input -->
<input type="file" id="file-upload">

希望这有帮助。