如何在onclick事件期间更改href

时间:2015-03-11 15:43:34

标签: javascript jquery html html5

我正在尝试创建一个动态超链接,用于下载从服务器检索到的图像。

我正在使用的代码:

HTML:

<a class="btn" id="controlDownloadJPEG" download>Save & Download</a>

JS:

this.downloadJPEGClickHandler = function() {
    CollageCore.downloadJPEG(function(data){
        $("#controlDownloadJPEG").attr("href", "../file/fileStore.action?fileName=/" + data[0].AttachmentUrl);
    });;
    return true;
};

点击后href会发生变化,但链接本身会在我执行JavaScript之前链接到href集。第一次单击不执行任何操作,因为没有默认href,第二次单击将下载第一次单击应下载的内容。

我看到过使用JavaScript window.href的建议,而不是依赖于html标签本身。我需要使用html标签的原因是它的下载功能。

3 个答案:

答案 0 :(得分:1)

您正在处理异步调用,因为它是同步的。这就像订购一个交付披萨,并希望它一旦你下订单就在那里。除非你站在餐厅并且已经制作完成,否则这种情况不会发生。

当呼叫回来时,您需要取消点击并手动触发页面更改。所以你想使用window.location.href = "new path";而不是设置href。

this.downloadJPEGClickHandler = function() {
    CollageCore.downloadJPEG(function(data){
        window.location.href = "../file/fileStore.action?fileName=/" + data[0].AttachmentUrl;
    });
    return false;  //or preventDefault if you pass in event object
};

答案 1 :(得分:0)

如果您要将此活动附加到onClick(event)处理程序,则应该可以通过传递event.preventDefault();

来停止重定向

引用:http://api.jquery.com/event.preventdefault/

答案 2 :(得分:0)

阻止默认点击行为,更改href属性,然后模仿点击。应该工作。

$( "a" ).click(function( event ) {
  event.preventDefault();
  $("#controlDownloadJPEG").attr("href", "../file/fileStore.action?fileName=/" + data[0].AttachmentUrl);
  $(this).click();
});