Javascript 单击按钮时jquery重定向_Javascript_Jquery_Wordpress_Freegeoip

Javascript 单击按钮时jquery重定向

javascript jquery wordpress

Javascript 单击按钮时jquery重定向,javascript,jquery,wordpress,freegeoip,Javascript,Jquery,Wordpress,Freegeoip,我试图根据访问者的位置重定向按钮点击，我有两个窗口。以及使用freegeoip.net：我在Wordpress上使用这个：脚本正确地连接到Wordpress并运行，但重定向不起作用 <button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button> <button id="subscribe-ca" type="submit" class=

我试图根据访问者的位置重定向按钮点击，我有两个窗口。以及使用freegeoip.net：我在Wordpress上使用这个：脚本正确地连接到Wordpress并运行，但重定向不起作用

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

我同样希望此模式在每次访问时只出现一次，并且在站点的所有导航中都出现一次，而不是在每次重新加载页面时出现。提前谢谢

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

以下是jQuery：

jQuery(document).ready(function(){
  jQuery("#myModal").modal('show');
  jQuery.ajax({
    url: 'https://freegeoip.net/json/',
    type: 'POST',
    dataType: 'jsonp',
    success: function(location) {
      // If the visitor is browsing from Canada.
      if (location.country_code === 'CA') {
        jQuery('#subscriber-ca').on('click', function(){
          window.location.replace('http://www.google.com');
        });
        jQuery('#subscriber-us').on('click', function(){

          // Redirect visitor to the USA.
          window.location.replace('http://www.facebook.com');
        });
      } else if(location.country_code === 'US') {
        jQuery('#subscriber-ca').on('click', function(){
          window.location.replace('http://www.google.com');
        });
        jQuery('#subscriber-us').on('click', function(){  
          // Redirect visitor to the USA.
          window.location.replace('http://www.facebook.com');
        });
      }
    }
  });
});

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

这是模式：

<div id="myModal" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">Subscribe our Newsletter</h4>
            </div>
            <div class="modal-body">
                <p>Subscribe to our mailing list to get the latest updates straight in your inbox.</p>
                <form>
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="Name">
                    </div>
                    <div class="form-group">
                        <input type="email" class="form-control" placeholder="Email Address">
                    </div>
                                        <button id="subscribe-us" type="submit" class="btn btn-primary pull-left">US Subscriber</button>
                                        <button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>
                </form>
            </div>
        </div>
    </div>
</div>

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

要检查这是否是用户的第一次访问，可以将值存储在会话存储中：

window.sessionStorage.setItem("first_visit", "Y");

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

加载时检查会话存储。如果不存在，则打开模态对话框

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

希望有帮助。

试试这段代码

        <!doctype html>
        <html lang="en">
         <head>
          <meta charset="UTF-8">
          <meta name="Generator" content="EditPlus®">
          <meta name="Author" content="">
          <meta name="Keywords" content="">
          <meta name="Description" content="">
          <title>Document</title>
          <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
         </head>
         <body>

        <div id="myModal" class="modal fade">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title">Subscribe our Newsletter</h4>
                    </div>
                    <div class="modal-body">
                        <p>Subscribe to our mailing list to get the latest updates straight in your inbox.</p>
                        <form>
                            <div class="form-group">
                                <input type="text" class="form-control" placeholder="Name">
                            </div>
                            <div class="form-group">
                                <input type="email" class="form-control" placeholder="Email Address">
                            </div>
                                <button id="ussubscribe" type="button" class="btn btn-primary pull-left">US Subscriber</button>
                                <button id="casubscribe" type="button" class="btn btn-primary pull-right">Canada Subscriber</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <script>
            var locationstatus = false;
            var userlocation = '';

            jQuery(document).ready(function(){
              jQuery.ajax({
                url: 'https://freegeoip.net/json/',
                type: 'POST',
                dataType: 'jsonp',
                success: function(locationresponse) {
                  userlocation = locationresponse.country_code;
                    locationstatus = true;
                    console.log(userlocation);
                }
              });
            });

            $('#ussubscribe').on('click', function(){
                alert();
                console.log(userlocation);

                if (locationstatus) {     
                    if(locationstatus=='CA'){
                      window.location.replace('http://www.google.com');
                    }
                }

             });

            $('#casubscribe').on('click', function(){
                 console.log(userlocation);

                 if (locationstatus) {      
                     if(locationstatus=='US'){
                        window.location.replace('http://www.facebook.com');
                     }
                 }
            });

        </script>
        </body>
        </html>

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

美国用户

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

更改类型=提交到类型=按钮//并确保

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

jQuery'subscriber-us'。在'click'上，函数{//检查subscribe-us的拼写

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

并在ajax调用之外添加onclick事件

内部if else子句仅隐藏/显示模式和按钮替换代码：

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

与：

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>

如果按钮不是根据ajax请求动态创建的，则在ajax外部绑定单击事件。

当您尝试单击重定向失败时，控制台中有什么内容？我尝试了控制台。记录单击事件，但没有反馈：这是我在控制台上所能找到的全部内容，JQMIGRATE:Migrate已安装，版本1.4.1为什么使用click on success f函数？您想触发点击事件还是用户想点击？@vel是的，我想在访问者点击按钮时触发点击事件他/她应该根据他/她的位置重定向并点击按钮，因为模式有两个按钮。我不确定这里缺少什么。因为即使使用console，console上也没有打印任何内容。log:awesome！这很有效，有什么建议我可以只弹出一次？而不是在页面上的所有导航中？谢谢！太棒了！有什么建议我可以只弹出一次？而不是在页面上的所有导航中？你必须使用本地存储太棒了！有什么建议我可以只弹出一次？而不是在所有导航中第页上有什么？

<button id="subscribe-us" type="submit" class="btn btn-primary pull left">US Subscriber</button>
<button id="subscribe-ca" type="submit" class="btn btn-primary pull-right">Canada Subscriber</button>