如何以编程方式为 JavaScript 中的文件输入元素触发点击事件？

在本文中，我们将学习如何以编程方式在输入文件元素上触发点击事件。

方法：每当您想以编程方式执行点击事件时，在您的特定条件下，只需使用 JavaScript 内置的click() DOM对象的函数。例如：

document.getElementById('your_input_type_file_element_id').click();

示例 1：我们想自动（以编程方式）单击输入文件元素。当用户点击输入类型文件元素的不是“文件上传”按钮的一个按钮时，我们可以使用下面的代码来实现。

HTML

  function open_file(){
      document.getElementById('input_file').click();
  }


    
    
      click event fire programmatically for input 
      type file element
    

输出：输入文件类型是隐藏的，因此无论何时运行此代码，您都可以轻松获得用于文件选择的选择对话框。单击上面的按钮后，我们会得到如下图所示的文件选择对话框。

示例2：例如，当用户注册您的服务时，它使用电子邮件、用户名和密码等进行注册。每当用户注册成功时，您通过电子邮件或短信给他们一个密钥。用户在特定页面的输入框中输入此密码，之后他们可以选择所需的文档/图像。

HTML

    
        
        function open_file() {
            var secret_key = document.getElementById("secret_key").value;
            if (secret_key == "Geeksforgeeks") {
                
                // 'Geeksforgeeks' this value is just an example for 
                // your understanding.
                document.getElementById("input_file").click();
            }
        }
        
    
    
        Write down 'Geeksforgeeks'
        Enter Secret Key :
        
        
    

输出：在输入框中输入正确的密钥后，会弹出文件选择对话框。生成 AJAX 请求，并通过后端文件将该用户密钥与原始密钥匹配。