Question

我有一个如下编写的javascript函数，在 Firefox 下可以正常下载给定的txt内容。

  self.downloadURL = function (url) {
        var iframe;
        iframe = document.getElementById("hiddenDownloader");        
        if (iframe === null) {
            iframe = document.createElement('iframe');
            iframe.id = "hiddenDownloader";
            iframe.style.display = "none";
            document.body.appendChild(iframe);
        }
        iframe.src = url;
    }

但由于某些原因， IE 9 无效。所以我试着转换成等效的jquery，因为jquery与所有浏览器兼容。

这里是相同函数的jquery等价物：

   self.downloadURL = function (url) {
        var iframe;
        iframe = $("#hiddenDownloader");        
        if (iframe === null) {
            iframe = $('<iframe></iframe>');
            iframe.id = "hiddenDownloader";            
            $("#hiddenDownloader").css("display", "none");
            $(document.body).append(iframe);
        }
        iframe.src = url;
    }

但现在它无法在两者浏览器中使用。请帮助我告诉我我做错了什么。

Answer 1

您的问题出在：

iframe = $('<iframe></iframe>');
iframe.id = "hiddenDownloader";

iframe指的是jQuery对象而不是DOM节点。您必须使用.prop来设置ID：

iframe = $('<iframe></iframe>');
iframe.prop('id', "hiddenDownloader");

此外你也有同样的问题：

if (iframe === null) {

您需要检查iframe的长度：

if (iframe.length === 0) {

再次在iframe.src = url;也许你可以解决这个问题：

iframe.attr('src', url);

但为什么要将vanilla JavaScript转换为jQuery？

Answer 2

似乎是一种下载文件的奇怪方式。

无论如何，这可能和原作一样：

if (!iframe.get(0)) {
  ...
}

...和id属性作为另一张海报提及。

Answer 3

尝试：

iframe = $("#hiddenDownloader")[0];

Answer 4

将iframe.src = url;替换为iframe.attr("src",url + "?"+ Math.random()); 以防止IE9中的缓存问题 。
将iframe.id = "hiddenDownloader";替换为iframe.attr("id","hiddenDownloader");
将if (iframe === null) {替换为if (iframe.length === 0) {

Answer 5

iframe = document.getElementById("hiddenDownloader");          
iframe = $("#hiddenDownloader");

这些行不相同。第二个创建一个jQuery对象，因此对null的检查永远不会等同于true

Answer 6

此链接可能对您有所帮助：

http://www.sitepoint.com/forums/showthread.php?743000-IE9-Iframes-DOCTYPES-and-You

或者您可以将其添加到顶部：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

javascript函数转换为jquery等价物

6 个答案: