【问题标题】:jquery cookie issue - does not open modal windowjquery cookie问题 - 不打开模式窗口
【发布时间】:2017-09-07 23:12:21
【问题描述】:

我对 jquery-cookie 插件有一个小问题,正如您在 functions.php 中看到的那样,首先我注册脚本,然后将 jquery_cookie_script 排入队列,但无法正常工作......我想在用户今天打开网站时存档,并且scroll.Top() > 窗口高度的 50%,将打开模态窗口。当点击 X 按钮关闭模态窗口时,刷新整个页面后将无法再次打开,只有 7 天。

你可以在下面看到我的代码,我需要一些帮助来解决这个问题,因为根本不起作用。

jQuery(document).ready(function($) {

  $(window).scroll(function(event) {
    var y = $(this).scrollTop();
    var half_height = $(window).height() / 2;
    if (y > half_height) {
      if ($.cookie('modal_shown') == null) {
        $.cookie('modal_shown', 'yes', {
          expires: 7,
          path: '/'
        });
        $('#modal').reveal();
      }
    }
  });
});
in functions.php 
function enqueue_custom_js(){
	wp_enqueue_script('custom', get_stylesheet_directory_uri() . '/js/custom.js',array(),time());
  wp_register_script( 'jquery_cookie_script', 'http://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js',array(),time());
  wp_enqueue_script( 'jquery_cookie_script');
}

add_action('wp_enqueue_scripts','enqueue_custom_js');

HTML
<!-- Modal -->
<div class="modal fade" id="modal" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      </div>
      <div class="modal-body text-center">
        <span class="title_subtitle white">Hey babe!<br>Let's link up!</span><br>
        <span class="get_off">Get 15% OFF</span><br>
        <span class="first_order white">your first order</span><br>
        <span class="arrivals white">new arrivals, contests and promos to your inbox</span><br>
        <input type="email" name="email" placeholder="Email" required>
        <button class="btn subscribe-btn" value="Submit">Join Now</button>
      </div>
      <div class="modal-footer text-center">
        <a data-dismiss="modal" title="No thanks, I don't need a Promo Code">No thanks, I don't need a Promo Code</a>
      </div>
    </div>
  </div>
</div>

【问题讨论】:

    标签: jquery-cookie


    【解决方案1】:

    我找到了一个可以正常工作的解决方案

    jQuery( document ).ready( function( $ ) {
    
    $(document).on('scroll', function() {
      var y = $(this).scrollTop();
      var half_height = $(window).height()/2;
      if (y > half_height) {
        $(document).off('scroll');
    
            if ($.cookie('pop') == null) {
                $('#modal').modal('show');
            $.cookie('pop', '7');
            }
        }    
    });
    

    });

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-12-27
      • 1970-01-01
      相关资源
      最近更新 更多