使用jQuery动态创建并“点击”链接

19
我想动态创建一个 <a href="mailto:..."> 元素,然后“点击”它,但不修改页面。
我正在尝试以下代码:
$('<a href="mailto:test@test.com">&nbsp;</a>').click();

...毫无结果

15个回答

46

这不是jQuery,但它完全可以工作。

var link = document.createElement('a');
link.href = url;
document.body.appendChild(link);
link.click();    

4
谢谢您回答了确切的问题 :) - mcont
1
非常简单易用的解决方案 - Deepak Bhatta
2
如果您正在尝试下载一个XML文件,请添加以下行:link.download = url;否则,该XML文件将在浏览器中显示。 - JS5

15

点击链接意味着更改 window.location,那么

window.location = "mailto:test@test.com";

8
这不会在所有浏览器中传递引荐者信息,因此它并不严格等同于创建一个链接并单击它。 - terrace
请参见以下链接:https://dev59.com/cG445IYBdhLWcg3wpL1_ - terrace
6
这并没有解决问题。它只是展示了如何改变当前的窗口位置,而没有回答如何以编程方式创建一个元素然后以编程方式单击它的问题。 - MingMan

15
要让它与jQuery一起工作,您首先需要在jQuery对象内选择DOM元素。
$('body').append('<a id="link" href="mailto:test@test.com">&nbsp;</a>');
$('#link')[0].click();

请注意 [0]

fiddle: https://jsfiddle.net/fkwhvvhk/


1
哇,只需检索DOM元素_然后_单击它。但是为什么jQuery的click()函数不会为每个查询项调用DOM函数? - T-moty
3
在一堆垃圾回答中,我认为这是最好的回答。我只是在我的代码中加了 [0],现在它可以工作了。很荒谬。链接在 DOM 中,jQuery 可以找到链接,但出于不明显的原因,它不会点击链接。没有错误,什么都没有。感谢这个三个字符的修复。 - Andrew
$('#link')[0].click();在控制台中报错,显示“TypeError: $(...)[0]未定义”。使用的是JQuery 3.2.1和现代Firefox浏览器(版本68)。我也讨厌“垃圾”答案... - McAuley
如果你使用这个解决方案并且出现了错误信息 "TypeError: $(...)[0] is undefined",那么原因很简单,元素尚不存在。因此你需要等待它的存在。请参见我的回答,了解如何实现:https://dev59.com/lWw15IYBdhLWcg3wmc8J#74130818 - RWC

10

.click() 是操作DOM元素的方法,而不是jQuery对象的方法。

$('<a href="mailto:test@test.com"></a>')[0].click();

这是回答问题最简单的解决方案。也可以使用 jQuery 来避免与 $ 冲突:jQuery(<a href="/product-edit/${this.selected.id}"></a>)[0].click(); - Grant
如果您使用此解决方案并且收到错误消息“TypeError: $(...)[0]未定义”,原因很简单,该元素尚不存在。因此,您必须等待其存在。请参阅我的答案,了解如何执行此操作:https://dev59.com/lWw15IYBdhLWcg3wmc8J#74130818 - RWC

5
请尝试像这样做...
演示:http://jsfiddle.net/wdm954/xtTGX/1
$('.a').append('<a class="b" href="mailto:test@test.com">&nbsp;</a>');
$('.b').click(function() {
    window.location = $(this).attr('href');
}).click();

2
您可以这样创建标签:
$('PARENT_TAG').append('<a id="dinamic_link" href="mailto:test@test.com">&nbsp;</a>');
//Now click it
$('#dinamic_link').click();

HTH!


3
这似乎对我不起作用。也许有什么干扰,但是“ .click()”在/任何/链接上似乎都不能工作。 - aidan

2
为什么不直接将窗口位置更改为链接的href?你需要使用链接的特定原因吗?
否则:
window.location = 'http://example.com';

2

我发现了一些类似问题,并找到了对我来说最简单的方法:

    var link = document.createElement('a');

    link.download = 'profile.png';
    link.href = '...';
    link.id = 'example';
    link.class = '...';

    document.body.appendChild(link);

    link.click();

在我的情况下,我花了很多时间尝试使用 jquery 来做这件事,执行 $('#example').click(),但对我来说不起作用。至少问题是由于 jquery,我没有使用它。希望这可以帮助其他人。这是一种简单的方式来设置一个锚点以下载图像并在点击后执行。


1
$('#something').append('<a id="link" href="mailto:test@yourdomain.com"></a>');
$('#link').trigger('click');

3
这对我似乎不起作用。也许有什么干扰,但是.click()在/任何/链接上似乎都不起作用。 - aidan

1
我建议你考虑使用 .append() 将 href 添加到容器(大多是 div)中,并调用 .click()。
$('parent_div').append('<a id="link" href="mailto:test@test.com">&nbsp;</a>');
//Now click it
$('#link').click();

2
这似乎对我不起作用。也许有些东西在干扰,但是.click()在/任何/链接上似乎都不起作用。 - aidan

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接