javascript - jquery click 不适用于 IE11 中动态添加的 href

Question

您好，我的 HTML 代码中有一些链接。我想更改悬停时每个链接的 href 属性，然后单击此链接时我想在新选项卡中打开它。代码如下:

$('.identifierClass').hover(function(e) {
if(condition) // is true
{
    $(element).attr("href", "url/goes/here").off().click(function(e) {
        $(element).attr("target", "_blank");
    });
 }
});

在 Chrome/Firefox 中一切正常，但是，在 IE 11 中单击链接时，它只是挂起并且单击不起作用。

感谢任何帮助。

Answer 1

您需要绑定(bind)到静态或预先存在的元素，动态元素将在其中创建:

$(document).on('mouseenter','.identifierClass',function(e) {
if(condition) // is true
{
    $(element).attr("href", "url/goes/here").attr("target", "_blank");
 }
});

编辑:这里是 fiddle当使用事件的字符串名称时，我还必须使用“mouseenter”而不是“hover”。 jquery .hover() documentation

在 fiddle 中，我向您展示了两个动态添加的 div:

$('#place').html('<div class="identifierClass">hover1</div><div class="identifierClass2">hover2</div>');

在此之上，我设置了事件处理程序，对于hover1 div，我使用指定的选择器在文档上设置了事件:

$(document).on('mouseenter','.identifierClass',function(e) {
alert('hi');
});

当您将“hover1”文本悬停在右侧时，您可以看到此功能有效，相反，您可以看到使用此绑定(bind)时，hover2 不起作用:

$('.identifierClass2').hover(function(e) {
alert('hi2');
});

here是有关事件委托(delegate)的 jquery 文档的链接。

编辑2:我更新了fiddle解决“href”操纵问题。看来您只想更改悬停部分的一些属性:

我将“mouseenter”绑定(bind)修改为如下所示:

$(document).on('mouseenter','.identifierClass',function(e) {
    alert('hi');    $('#someLink').attr('href','http://www.bing.com').attr('target','_blank');
});

我认为您不需要“关闭”或“点击”，但这是基于一些假设，所以请随意发表评论，我可以相应更新。不过，当鼠标进入动态元素时，这将更改 href 并更改目标属性。