Question

<a onclick="determineCountry(data)" class="installbtn">Install</a>

我想做什么：单击上面的按钮时，用户将根据他/她的位置重定向到三个站点之一。但是，下面的脚本会立即执行，并在页面加载时重定向用户，而不是在单击按钮时（按预期）重定向。我究竟做错了什么？请帮我解决这个问题。

<script>
function determineCountry(data){
   switch(data.address.country_code){
      case "US" :
         window.location.href = "https://www.usa.com";
      break;
      case "GB" :
         window.location.href = "https://www.gb.com";
      break;
      default :
         window.location.href = "http://www.google.com";
   }    
}
</script>

<script type="text/javascript" src="http://api.wipmania.com/jsonp?callback=determineCountry></script>

Answer 1

您的上一行加载了JSONP网站。 JSONP的工作原理是让服务器发回调用函数的Javascript。当您指定callback=determineCountry时，它会告诉它在Javascript中调用该函数。所以最后的脚本包含一个顶级调用，如：

determineCountry({ some JSON object });

加载脚本时，它会立即运行该功能。

通常JSONP用于AJAX调用，而不是直接用于<script>标记。所以你可能只是想删除这行

<script type="text/javascript" src="http://api.wipmania.com/jsonp?callback=determineCountry></script>

实际上，您真正需要做的是在用户点击锚点时执行JSONP AJAX调用：

<a onclick="ajaxDetermineCountry();" href="#" class="installbtn">Install</a>

<script>
function ajaxDetermineCountry() {
    var script = document.createElement('script');
    script.src = "http://api.wipmania.com/jsonp?callback=determineCountry";
    document.head.appendChild(script);
}
function determineCountry(data){
   switch(data.address.country_code){
      case "US" :
         window.location.href = "https://www.usa.com";
        break;
      case "GB" :
         window.location.href = "https://www.gb.com";
        break;
      default :
         window.location.href = "http://www.google.com";
   }    
}
</script>

Javascript函数执行..没有被调用？

1 个答案: