javascript jQuery .click() 在 Safari 中不起作用
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/23497825/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery .click() does not work in Safari
提问by Magnanimity
I have seen several similar posts with solutions that seemed to have worked for those people, but I CANNOT get this to work.
我看过几个类似的帖子,其中的解决方案似乎对这些人有用,但我无法让它发挥作用。
I am using http://tutorialzine.com/2013/05/mini-ajax-file-upload-form/in my project. It works PERFECTLY, in all browsers, except in Safari the "BROWSE" button does not open a file dialog. The following code exists in script.js (which is included for the plugin to work):
我在我的项目中使用http://tutorialzine.com/2013/05/mini-ajax-file-upload-form/。它在所有浏览器中都能完美运行,除了在 Safari 中,“浏览”按钮不会打开文件对话框。script.js 中存在以下代码(包含在插件中):
$('#drop a').click(function(){
// Simulate a click on the file input button
// to show the file browser dialog
$(this).parent().find('input').click();
});
The .click() does not fire in Safari. I have tried the solution as per jQuery .click() works on every browser but Safariand implemented
.click() 不会在 Safari 中触发。我已经按照jQuery尝试了该解决方案.click() 适用于每个浏览器,但 Safari并已实现
$('#drop a').click(function(){
var a = $(this).parent().find('input');
var evObj = document.createEvent('MouseEvents');
evObj.initMouseEvent('click', true, true, window);
a.dispatchEvent(evObj);
});
But then I get the error that dispatchEvent is not a function
. I then did some research on this, and tried the jQuery.noConflict() route, but this did not resolve the error. Also, I use a LOT of jQuery in my main file and I cannot have the noConflict() mode activated for the entire page. There is also no reason that the jQuery should be conflicting with anything as I am only using jQuery and normal javascript and I am not using anything like prototype or angular. Does anybody know of another way to simulate a click in Safari?
但后来我得到的错误是dispatchEvent is not a function
. 然后我对此做了一些研究,并尝试了 jQuery.noConflict() 路线,但这并没有解决错误。此外,我在主文件中使用了大量 jQuery,并且无法为整个页面激活 noConflict() 模式。也没有理由认为 jQuery 应该与任何东西发生冲突,因为我只使用 jQuery 和普通的 javascript,我没有使用原型或角度之类的东西。有人知道在 Safari 中模拟点击的另一种方法吗?
UPDATE:Just FYI, I have added an alert('test')
in the mentioned function (which triggers when "BROWSE" is clicked), and I do get the alert in Safari, but it is not simulating the click of the file input element, i.e: it is not openening the file dialog.
更新:仅供参考,我alert('test')
在提到的函数中添加了一个(在单击“浏览”时触发),并且我确实在 Safari 中收到了警报,但它并没有模拟文件输入元素的单击,即:它是不打开文件对话框。
采纳答案by Magnanimity
The second section of code in my original question turned out to work, except for 2 things.
我原来问题中的第二部分代码结果有效,除了两件事。
1) The method does not like jQuery, so instead of
1)该方法不喜欢jQuery,所以代替
var a = $(this).parent().find('input')[0];
var a = $(this).parent().find('input')[0];
I assigned an ID to my file input and instead called
我为我的文件输入分配了一个 ID,而是调用了
var a = document.getElementById('upload_select');
var a = document.getElementById('upload_select');
2) Safari blatantly ignores this if the input is hidden (display:none;
), which is was, so instead I made the input font-size = 1px; and opacity = 0.
2) 如果输入是隐藏的 ( display:none;
),Safari 会公然忽略这一点,实际上是这样,所以我将输入的 font-size = 1px; 和不透明度 = 0。
Implementing these two changes got the code working.
实现这两个更改使代码工作。
回答by T.J. Crowder
You need to read that answermore closely. :-)
您需要更仔细地阅读该答案。:-)
dispatchEvent
is a function on the DOM element, not the jQuery object. You're trying to call it on the jQuery object. So:
dispatchEvent
是 DOM 元素上的函数,而不是 jQuery 对象。您正试图在 jQuery 对象上调用它。所以:
$('#drop a').click(function(){
var a = $(this).parent().find('input')[0];
// Change here -----------------------^^^
var evObj = document.createEvent('MouseEvents');
evObj.initMouseEvent('click', true, true, window);
a.dispatchEvent(evObj);
});
Using the [0]
on the jQuery object gives you the first DOM object in the jQuery object, or undefined
if the jQuery object is empty.
使用[0]
jQuery对象上给你的第一个DOM对象jQuery对象中,或者undefined
如果jQuery对象是空的。