文件输入javascript点击不是从真正的鼠标点击生成的 [英] file input javascript click generated not from a real mouse click chrome

问题描述

正如你在这里看到的那样： http://jsfiddle.net/cavax/K99gg/3/ ，点击一个元素可以触发点击文件输入，但是例如，将一个元素悬停不会触发输入点击。

  $（'＃test'）。on 'click'，function（）{
 $（'＃upload'）。trigger（'click'）; 
}）; $（'＃upload'）。trigger（'click'）; 
}）; $ b $（'＃test'）。（'mouseenter'，function（）{
 $ 
  

在现实生活中，我遇到了这个麻烦，因为在一个web应用程序中我正在加载throw ajax一个内容巫婆在一个输入文件里面。
在加载结束时，弹出文件必须打开，但无法在Chrome上运行（在FF上运行）。

问题我猜是这个动作不是由鼠标点击（悬停，超时等）产生的，所以chrome不会触发fileupload。

我也试过这个： http://jsfiddle.net/cavax/K99gg/7/ ，所以点击元素，等待然后触发点击但没有，因为在点击和触发中间有settimeout：（$ / b
$ b

  $ （'#test'）。on（'click'，function（）{
 setTimeout（function（）{
 $（'＃upload'）。trigger（'click'）; 
 }，3000）; 
））; 
  

如果删除延迟： http://jsfiddle.net/cavax/K99gg/8/ 它的工程
任何想法获得这项工作？

解决方案

没有办法t o由于安全原因，触发输入文件类型的点击事件。

您可以尝试对此进行破解通过将按钮/ div 位置设置为绝对和顶部到 -100px
这意味着通过设置上面的样式使它可以工作，将它定位在视口之外。

但对于 mouseenter 和 mouseover 我不认为它会起作用！

编辑：

在视口和目标点击事件之外移动输入

点击示例

注意：现在点击出现2次，就像你写的一样

  $（'＃upload'）。trigger（'click'）。click（）; 
  

您只需要

  $（ '＃上传'）触发（ '点击'）;除非你想让它触发多于$（$＃''上传'）。点击（）
  

单身。

i'm having trouble in chrome opening the popup for the file upload of a file input type.

As you can see here: http://jsfiddle.net/cavax/K99gg/3/, clicking on an elements can trigger a click on the file input, but for example hovering a element wont trigger a click on the input.

$('#test').on('click', function(){
   $('#upload').trigger('click');
});
$('#test').on('mouseenter', function(){
   $('#upload').trigger('click');
});

In the real life i'm having this trouble because in a web app i'm loading throw ajax a content witch has inside an input file. At the end of the load the popup file must open, but there is no way to get this works on Chrome (workign on FF).

The problem i guess is that the action is not generated by a mouse click (hover, timeout etc) so chrome wont trigger the fileupload.

I've also tryed this: http://jsfiddle.net/cavax/K99gg/7/, so click on the element, wait then trigger the click but nothing, because there is the "settimeout" in the middle of the click and the trigger :(

$('#test').on('click', function(){
  setTimeout(function(){
    $('#upload').trigger('click');
  }, 3000);
});

if you remove the delay: http://jsfiddle.net/cavax/K99gg/8/ it works Any idea to get this work?

解决方案

There is no way to trigger click event of input file type, because of a security reason.

You may try a hack of this by setting your button/div position to absolute and top to -100px It means positioning it outside the viewport by setting above style make it works.

But for mouseenter and mouseover i don't think it's going to work!

Edit:

Moved input outside the viewport and target click event

Example on click

Side note: Right now click occurs 2 times as you have written

$('#upload').trigger('click').click();

You just need

$('#upload').trigger('click');  //  $('#upload').click() 

unless you want it to fire more than single time.

这篇关于文件输入javascript点击不是从真正的鼠标点击生成的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！