Question

我有一个通过AJAX提取数据的页面。除此之外，我还有一个链接可以将所述数据下载为CSV文件。

我遇到的问题是，我需要传递一些参数以及click事件，以便服务器可以返回正确的CSV文件。

没有任何处理，链接如下所示：

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

然后会触发返回CSV的ASP.NET MVC Controller操作。我想要做的是在查询字符串中传递两个参数。最初我认为我可以拦截click事件并将数据添加到查询字符串中，如下所示：

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);

似乎在此阶段更改href不会及时更新链接，并且URL会像到达服务器时那样？

是否可以在点击后更改网址，还是需要查看其他方法？

由于

Answer 1

您可以自己重定向窗口，如下所示：

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

或者，无论是更新这些隐藏字段，都要更新链接然后而不是点击它，例如：

$("#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;
  });
});

主要区别在于它仍然允许正常的点击行为，ctrl + click等等。

Answer 2

只需简化选项，您就可以在链接中添加span：

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

...然后将click事件挂钩到span，这将发生在链接上的click之前。

Answer 3

你可以在这里重新定位javascript： -

    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;

你有人可以禁用js，但你的代码完全基于js。感谢

Answer 4

没有href，点击会重新加载当前页面，所以你需要这样的东西：

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

或者像这样阻止滚动：

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

或者在你的f1函数中返回false并且：

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

....或者，不引人注目的方式：

<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>

如何在单击锚点后更改锚点的href？

4 个答案: