【问题标题】：.click() not getting fired over an anchor tag after modifying its download attribute.click() 在修改其下载属性后不会被锚标签触发
【发布时间】：2014-07-04 18:31:30
【问题描述】：

我的情况是“系统需要询问用户‘您是要打开图像还是下载图像？’通过使用确认框.. 如果用户按下确定，我们不应该阻止该锚标记的默认操作，放手，但如果用户按下取消，则应该下载特定图像...

HTML：

<a href="http://cdn.sstatic.net/stackoverflow/img/sprites.png?v=3c6263c3453b">test</a>

JS：

$('a').click(function (e) {
    if (!$(this).is('[download]')) {
        var cond = confirm('Press ok to view, cancel to save..');
        if (!cond) {
            e.preventDefault();
            $(this).attr('download', 'download').click().removeAttr('download');
        }
    }
});

DEMO

谁能告诉我如何做到这一点..？

【问题讨论】：

.trigger() 事件会有用吗？api.jquery.com/trigger
@NishanthiGrashia 我认为两者都是一样的。我在看到您的评论后尝试了它。但它没有响应..
This 可能会有所帮助。

标签： javascript jquery html

【解决方案1】：

您需要使用this.click();，因为HTMLElement.click() 方法模拟鼠标点击元素。

而$(this).click(); 只会触发jquery click 处理程序，而onclick 处理程序仅限于元素。

$('a').click(function (e) {
    if (!$(this).is('[download]')) {
        var cond = confirm('Press ok to view, cancel to save..');
        if (!cond) {
            e.preventDefault();
            $(this).attr('download', 'download');
            this.click()
            $(this).removeAttr('download');
        }
    }
});

DEMO

【讨论】：

@RajaprabhuAravindasamy 你的事件被调用，但它没有做任何事情，因为你的链接.is('[download]')，使用 jQuery 以编程方式触发点击不会模拟链接点击（这是你需要的）。 See this question here
@billyonecan 你的评论非常有用，它完全澄清了我的疑问，你们刚刚教给我一个我以前不知道的新概念......

【解决方案2】：

试试这个，$("a")[0].click() 会成功的

$('a').click(function (e) {
    if (!$(this).is('[download]')) {
        var cond = confirm('Press ok to view, cancel to save..');
        if (!cond) {
            e.preventDefault();
            $(this).attr('download', 'download');
            $("a")[0].click().removeAttr('download');
        }
    }
});

Demo

【讨论】：

而且它也没有删除属性，因为它不是一个 Jquery 对象。我想知道为什么 jquery 的click() 不起作用。？谁能告诉我确切的原因..？
@RajaprabhuAravindasamy，你可以用this.click();$(this).removeAttr('download'); 代替$("a")[0].click().removeAttr('download'); jsfiddle.net/88dn8 你很清楚该怎么做
@Satpal 但为什么是this.click(); 而不是$(this).click();。
@Satpal 是的.. 通过使用this.click(); 我暂时在我的项目中修复了它.. 但是为什么$(this).click() 没有工作..？这真的很神秘..
@Satpal 但据我所知this.click(); 这里 this 是一个 dom 节点，而这里 $(this).click(); $(this) 是一个 jQuery对象，所以问题是为什么 jQuery 的 click() 方法使用 dom 节点而不使用 jquery 对象。 ^^

【解决方案3】：

$('a').click(function (e) {
  if (!$(this).is('[download]')) {
  var resp = confirm("Press ok to view, cancel to save..!");
   if (resp == true) {
  // You pressed OK
    e.preventDefault();
    } else {
  //    Pressed Cancel!";
     $(this).attr('download', 'download').click().removeAttr('download');
   }        
  }
});

你去工作小提琴

http://jsfiddle.net/sajrashid/94Hra/18/

【讨论】：

【解决方案4】：

没有必要用这个来搞乱事件冒泡。让浏览器的默认行为处理一切。手动调用事件总是会造成混乱。使用download 属性控制行为。根据您的情况添加或删除它并将球传给浏览器。

Demo

代码：

$('a').click(function (e) {
    var cond = confirm('Press ok to view, cancel to save..');
    if (!cond) {
        $(this).attr('download', 'download');
    } else {
        $(this).removeAttr('download');
    }
});

【讨论】：

【解决方案5】：

我检查了您的代码并找到了解决方案所以你必须稍微改变你的代码

你已经在你的锚标签中添加了一个名称标签，比如

<a href="http://cdn.sstatic.net/stackoverflow/img/sprites.png?v=3c6263c3453b" name="myevent">test</a>

现在替换你的代码

$('a').click(function (e) {

有了这个

$(document).on("click","a[name='myevent']", function (e) {

【讨论】：

jsfiddle.net/94Hra/15 不工作..？而且我认为这不是问题.. :\