在 <a> 上设置 href、下载和 onclick 属性不起作用

Question

我尝试插入 gpx/xml blob 下载的链接，并且还想设置文件名的下载属性，以及单击链接并下载文件时触发函数的 onclick 属性，但设置onclick 没有效果..

问题的一个根源很可能是我尝试在循环 json 文件中的多个功能的构造函数中设置这些属性。

这是相关的代码：

$.getJSON('my_trails_z.geojson', function(json) {
    trails_json = L.geoJson(json, {     
        onEachFeature: function(feature, layer) {
...
            var bb = new Blob([togpx(feature)], {type: 'application/gpx+xml'}); 
            var gpxLink = document.createElement("a");
            gpxLink.download = feature.properties.name + ".gpx";
            gpxLink.innerHTML = "GPX-Download"; 
            gpxLink.href =  window.URL.createObjectURL(bb);
            gpxLink.onclick = show_kofi_reminder;       // DOESNT WORK!!!???    
...
        }
    }
}
function show_kofi_reminder() {
     console.log('Test onclick function...')
}

Answer 1

a

标签具有默认的导航行为，默认情况下无法捕获点击事件。

要实现这个功能，你必须这样做：

gpxLink.onclick = show_kofi_reminder

function show_kofi_reminder(event){
event.preventDefault();

// your code here;
}

我希望这能回答您的问题。