Comment puis-je modifier le href d'une ancre après avoir cliqué dessus?

Question

J'ai une page qui tire des données via AJAX. De plus, j'ai un lien pour télécharger ces données sous forme de fichier CSV. Le problème que j'ai est que je dois passer certains paramètres avec l'événement click afin que le serveur puisse retourner le bon fichier CSV.

Sans traitement le lien ressemble à ceci:

<a href="/manager/TargetResults.csv" class="black">Download Target Reports</a> 

Ce puis Déclenché une action contrôleur ASP.NET MVC qui renvoie le CSV. Ce que je veux faire, c'est passer deux paramètres dans la chaîne de requête. Au début, je pensais que je pouvais intercepter l'événement clic et ajouter des données à la chaîne comme si la requête:

var holder = $('.hidden-information').first();         
var newOutlets = $('input[name="newoutlets"]', holder).val();         
var queryDate = $('input[name="enddate"]', holder).val();          
var anchor = $(this);          
var link = anchor.attr('href');         
link = link + "?endDate=" + queryDate + "&newOutlets=" + newOutlets; 
anchor.attr('href', link); 

Il semblerait que le changement de href à ce stade ne sera pas mise à jour le lien dans le temps et l'URL sera aussi c'était quand il frappe le serveur?

Est-il possible de changer une URL après avoir cliqué ou dois-je regarder une autre méthode?

Merci

Answer 1

Vous pouvez rediriger le vous-même, comme la fenêtre suivante:

var holder = $('.hidden-information').first();         
var newOutlets = $('input[name="newoutlets"]', holder).val(); 
var queryDate = $('input[name="enddate"]', holder).val(); 
window.location.href = this.href + "?endDate=" + queryDate + "&newOutlets=" + newOutlets; 
return false; //prevent default going-to-href behavior 

Ou, tout ce qui est mise à jour les champs cachés, mettez à jour le lien puis au lieu de quand il est cliqué, par exemple:

$("#someField").change(function() { 
    var holder = $('.hidden-information').first();         
    var newOutlets = $('input[name="newoutlets"]', holder).val(); 
    var queryDate = $('input[name="enddate"]', holder).val();        
    $("a.black").attr("href", function() { 
    return "/manager/TargetResults.csv" + "?endDate=" + queryDate + "&newOutlets=" + newOutlets; 
    }); 
}); 

La principale différence est ce qui permet encore le comportement de clic travail normal, ctrl + clic, etc.

Answer 2

vous pouvez faire ici javascript redirect: -

var holder = $('.hidden-information').first();         
    var newOutlets = $('input[name="newoutlets"]', holder).val();         
    var queryDate = $('input[name="enddate"]', holder).val();          
    var anchor = $(this);          
    var link = anchor.attr('href');         
    link = link + "?endDate=" + queryDate + "&newOutlets=" + newOutlets; 
    anchor.attr('href', link); 
    location.href=link; 

ya quelqu'un peut désactiver js mais votre code est entièrement basé sur js. Merci

Answer 3

Juste arrondir vos options, vous pouvez mettre un span à l'intérieur du lien:

<a href="/manager/TargetResults.csv" class="black"><span>Download Target Reports</span></a> 

... puis accrocher l'événement click sur le span, qui aura lieu avant la click sur le lien .

Answer 4

Sans avoir un href, le clic recharger la page en cours, vous devez donc quelque chose comme ceci:

<a href="#" onclick="f1()">jhhghj</a> 

ou empêcher le défilement comme ceci:

<a href="#" onclick="f1(); return false;">jhhghj</a> 

Ou return false dans votre fonction f1 et:

<a href="#" onclick="return f1();">jhhghj</a> 

....ou, la manière discrète:

<a href="#" id="abc">jhg</a> 
<a href="#" id="myLink">jhhghj</a> 

<script type="text/javascript"> 
    document.getElementById("myLink").onclick = function() { 
    document.getElementById("abc").href="xyz.php"; `enter code here` 
    return false; 
    }; 
</script>