$(element).click() 即使在 $(function() {}) 内部也不触发

Question

我有一个隐藏的输入元素 (Dropzone)，它写在原始 html 的正文中（未附加）。

<div style="display: none;">
    <form action="/uploadProfile" method="post" class="dropzone" id="uploadProfileDropzone"></form>
</div>

现在在我的 .js 脚本中，我正在尝试：

 $(function() {
      $('#uploadProfileDropzone').click()
 })

然后什么也没发生。但是，如果我在 Chrome 的控制台中调用 $('#uploadProfileDropzone').click()，它会起作用。

可能是什么问题？

编辑:

问题可能是我试图在我的 Dropzone 初始化之前调用该函数。有什么方法可以知道这种情况何时发生？

然而，即使在尝试时：

$(function() {
    setTimeout(function() {
         $('#uploadProfileDropzone').click() 
    }, 5000)
})

页面完全加载后很多，仍然没有任何反应

解决方案:

事实证明，某些（甚至大多数）浏览器会阻止此类 activity。现在回过头来看，原因很明显。我的目的是导航到一个页面，该页面一旦准备就绪，就会打开一个文件对话框以进行配置文件上传操作。从用户体验的角度来看，阻止此类操作似乎在逻辑上是正确的，因为它可能导致网站出现垃圾邮件和不需要的 activity。我通过在加载时显示一个简单的弹出框来解决它，它强制用户按下一个按钮，然后调用 $('#uploadProfileDropzone').click() 并且它起作用了。

Answer 1

您应该使用文档就绪事件（代码在元素初始化后工作）

$(document).ready(function(){
     $('#uploadProfileDropzone').click(function(){
        // Do something here
    });
});

或

$('#uploadProfileDropzone').on('click',function(){ write your code here });

Answer 2

您可能有两个选择：

1) 以编程方式创建您的放置区

Dropzone.autoDiscover = false;
let csvDropzone = new Dropzone("#uploadProfileDropzone", {
  paramName: "file",
  init: function() {
      $('#uploadProfileDropzone').click();
  }
});

<div style="display: none;">
    <form action="/uploadProfile" method="post" class="dropzone" id="uploadProfileDropzone">
    </form>
</div>

2) 你可以尝试直接使用 init 配置方法而不用在你的 JS 代码中初始化 dropzone:

// Taken from the dropzone config page
Dropzone.options.uploadProfileDropzone = {
  init: function() {
      $('#uploadProfileDropzone').click();
  }
};

Answer 3

事实证明，某些（甚至大多数）浏览器会阻止此类 activity。现在回过头来看，原因很明显。我的目的是导航到一个页面，该页面一旦准备就绪，就会打开一个文件对话框以进行配置文件上传操作。从用户体验的角度来看，阻止此类操作似乎在逻辑上是正确的，因为它可能导致网站出现垃圾邮件和不需要的 activity。我通过在加载时显示一个简单的弹出框来解决它，它强制用户按下一个按钮，然后调用 $('#uploadProfileDropzone').click() 并且它起作用了。

$(element).click() 即使在 $(function() {}) 内部也不触发

$(element).click() not triggering even inside $(function() {})

html

javascript

jquery

dropzone.js