2016-12-31 11 views
1

Я работаю над проектом, который имеет 2 страницы.Событие триггера на другой странице с использованием jquery или JavaScript

1) Индекс и 2) Настройки

У меня есть кнопка, чтобы закрыть элемент и скрыть его на странице настроек. Проблема в том, что я хочу скрыть элементы на странице Index, когда я нажимаю кнопку «Закрыть» на странице «Настройки» и выбираю «Сохранить». Я не могу добиться того же. Любая помощь будет оценена по достоинству. Большинство решений, которые я нашел, просто перенаправляются на другую страницу с помощью Jquery, но я хочу вызвать событие, а не просто перенаправлять.

Я создал codepen для того же: 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 Див и в 2 кнопок близких, по нажатию на любой кнопке закрытия, соответствующий DIV будет добавлена ​​шкурка класс.

+0

я не получил свой вопрос. на самом деле вы хотите скрыть div, нажав кнопку закрытия? –

+0

Да, я хочу закрыть div, когда нажата кнопка закрытия. Вы можете проверить то же самое в приведенном выше кодефе, но в настоящее время оба события находятся на одной странице. Я хочу, чтобы они были на разных страницах. – coderakki

ответ

1

Вы можете комбинировать значение cookie (которое можно установить при нажатии кнопки закрытия) с помощью $(window).focus прослушивателя событий, который проверяет значение 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/

+0

Спасибо за ваши усилия. Я пытаюсь с JS cookie, но все же исправить это. Попробуем посмотреть, поможет ли это. https://github.com/js-cookie/js-cookie – coderakki

+0

Будет редактировать код примера. –

+0

Будем ждать вашего кода. Я пытаюсь в то же время и обновляюсь, если получаю ответ – coderakki