使用 jquery 或 JavaScript 在不同页面上触发事件

Question

我正在做一个有 2 页的项目。

1) 索引和 2) 设置

我有一个按钮来关闭一个元素并将其隐藏在设置页面上。问题是，当我在设置页面中单击关闭并选择保存时，我想隐藏索引页面上的元素。我无法达到同样的效果。任何帮助，将不胜感激。 我发现的大多数解决方案只是使用 Jquery 重定向到其他页面，但我想触发一个事件而不仅仅是重定向。

我已经为此创建了一个代码笔：http://codepen.io/crazycoder775/pen/pNYJOw

  $(".list_sbar li").click(function(e) {
    if ($(this).outerWidth() - 34 <= e.offsetX)
        $(this).remove();
});
$(".list_sbar li").click(function(e) {
    if ($(this).outerWidth() - 34 <= e.offsetX)
        $(this).remove();
});
$(document).ready(function(){
    $("#hide").click(function(){
        $(".test1").hide();
    });
    $("#show").click(function(){
        $(".test1").show();
    });
});
$(document).ready(function(){
    $("#hide2").click(function(){
        $(".test2").hide();
    });
    $("#hide3").click(function(){
        $(".test3").hide();
    });
});

在上面的 codepen 中，我有 3 个 div 和 2 个关闭按钮，点击任何关闭按钮，相应的 div 将附加一个隐藏类。

Answer 1

您可以将 cookie 值（可以在单击关闭按钮时设置）与 $(window).focus 事件侦听器结合使用，该事件侦听器检查 cookie 值并在索引页面获得焦点时根据该值隐藏或显示元素。

Cookie 文档：https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie

尝试以下方法：

  $(document).ready(function(){
    if( document.cookie.indexOf('element_closed=')== -1){
        document.cookie = 'element_closed=false; path=/';
     }
    // document.cookie = "element_closed=true"; // uncomment to test focusing window with element hidden
    // used to get an individual cookie by name
    // from http://stackoverflow.com/questions/10730362/get-cookie-by-name
    function getCookie(name) {
      var value = "; " + document.cookie;
      var parts = value.split("; " + name + "=");
      if (parts.length == 2) return parts.pop().split(";").shift();
    }

    function hideElement(){
      $(".toggle_target").hide();
      document.cookie = 'element_closed=true; path=/'
      console.log(document.cookie);
    }

    $(window).focus(function(){
      //console.log(document.cookie);
      console.log(getCookie('element_closed'));
      if(getCookie('element_closed') == 'true'){
        hideElement();
      }
    });

    $(".toggle").on('click', function(e){
      e.preventDefault();
      hideElement();
    });
  });

工作 jsfiddle：https://jsfiddle.net/b1nyczht/20/