jQuery clickkevent с другой страницы

Question

jQuery clickkevent с другой страницы

0

У меня есть рабочий обработчик clickevent (не знаю, правильно ли это для него) на странице, которая использует show/hide (например, вкладки), если вы нажмете на одну из ссылок на странице. Это прекрасно работает, но теперь я перехожу к другому вопросу.

Когда я ссылаюсь на одну из вкладок с другой страницы, например. /page-slug/# tabtoshow, он не отобразит нужную вкладку, она просто отобразит первую (открытую) вкладку. Я хочу, чтобы он отображал правильную вкладку, когда URL-адрес содержит один и тот же идентификатор, например #tabtoshow. Вкладки будут иметь тот же идентификатор, что и ссылка.

Это мой текущий скрипт.

$(function() {
    $(".elevator a").click(function(evt) {
        evt.preventDefault();
    });
});        
$(document).ready(function() {
    $('a[href="#ondernemen"]').click(function() {
        $(".active").removeClass("active");
        $(this).parent('.label').addClass("active");
        $('#ondernemen').slideDown(1000);
        $('#ontdekken').slideUp(1000);
        $('#groeien').slideUp(1000);
        $('#spelen').slideUp(1000);
    });
    $('a[href="#groeien"]').click(function() {
        $(".active").removeClass("active");
        $(this).parent('.label').addClass("active");
        $('#groeien').slideDown(1000);
        $('#ontdekken').slideUp(1000);
        $('#ondernemen').slideUp(1000);
        $('#spelen').slideUp(1000);
    });
    $('a[href="#spelen"]').click(function() {
        $(".active").removeClass("active");
        $(this).parent('.label').addClass("active");
        $('#spelen').slideDown(1000);
        $('#ontdekken').slideUp(1000);
        $('#groeien').slideUp(1000);
        $('#ondernemen').slideUp(1000);
    });
    $('a[href="#ontdekken"]').click(function() {
        $(".active").removeClass("active");
        $(this).parent('.label').addClass("active");
        $('#ontdekken').slideDown(1000);
        $('#spelen').slideUp(1000);
        $('#groeien').slideUp(1000);
        $('#ondernemen').slideUp(1000);
    });
    $('body').on({
    'mousewheel': function(e) {
        if (e.target.id == 'el') return;
        e.preventDefault();
        e.stopPropagation();
        }
    })
    $('a[href="#ontdekken"]').parent('.label').addClass("active");
});

Заранее спасибо!!

arvanderkamp 29 апр. 2014, в 22:12

Источник

0

Вы используете JQuery UI?
Cameron Tinker 29 апр. 2014, в 20:00
0

Да @ КамеронТинкер, я
arvanderkamp 29 апр. 2014, в 20:08

Теги:

javascript

jquery

2 ответа

Ещё вопросы

Lajos Arpad · Answer 1 · 2014-04-29T22-38-00.000Z

0

У вашего кода было некоторое повторение, я написал для вас более общую версию. Кроме того, я использовал location.hash чтобы определить, какую вкладку активировать.

$(document).ready(function() {
    var selector = "#ondernemen, #ontdekken, #groeien, #spelen";
    $(".elevator a").click(function(evt) {
        evt.preventDefault();
    });
    $(selector).click(function() {
        var that = this;
        $(".active").removeClass("active");
        $(this).parent('.label').addClass("active");
        $(selector).each(function() {
            if ($(this).attr("id") !== $(that).attr("id")) {
                $(this).slideUp(1000);
            }
        });
        $(this).slideDown(1000);
    });
    $('body').on({
    'mousewheel': function(e) {
        if (e.target.id == 'el') return;
        e.preventDefault();
        e.stopPropagation();
        }
    });
    $(location.hash).parent('.label').addClass("active");
});

Lajos Arpad 29 апр. 2014, в 22:38

0

Спасибо за ваше время, Лайос! К сожалению, это не сработает, потому что некоторые элементы нужно сдвинуть вниз. С этим кодом они будут только скользить вверх. Возможно, лучше взглянуть на веб-сайт, чтобы увидеть, как работает моя «навигация по вкладкам»? Правильная страница www.gastouderfabriek.nl/trainingen/
arvanderkamp 30 апр. 2014, в 06:26
0

Я думаю, что нам нужно добавить это для каждого элемента, например, если $('a[href="#spelen"]').click(function() и если $(location.hash) имеет право, сделайте это с slideUp и slideDown. Вы тоже так думаете? Только я не знаю, как это закодировать ... Не могли бы вы мне помочь?
arvanderkamp 30 апр. 2014, в 06:29
0

Я только что видел, как вы прокомментировали. Когда я ответил, я очень устал, поэтому я не видел, чтобы вы вызывали функцию slideDown.
Lajos Arpad 30 апр. 2014, в 20:04
0

Также обратите внимание, что ваш dynamic-captions.css не удалось загрузить, возможно, вам не хватает некоторых ваших разработок.
Lajos Arpad 30 апр. 2014, в 20:07
0

Кроме того, дайте вашим якорям некоторые идентификаторы, это грязно, выбирая их по href, также, из вашего кода мы можем видеть, что вы предположили, что они имеют идентификаторы (например: $ ('# ondernemen'). SlideDown (1000);), но у них не было ни одного. Итак, исправьте ваш HTML (добавьте идентификаторы к якорям), примените мой код и исправьте его, если необходимо (я не проверял его), исправьте вашу ссылку на файл CSS и вернитесь сюда и расскажите нам, что случилось :)
Lajos Arpad 30 апр. 2014, в 20:11
0

Спасибо @Lajos за ваше время! К сожалению, это не работает, даже после того, как я предоставил якорям удостоверение личности. Я согласен, что код грязный, но пока работает. Я решил это с помощью if(window.location.hash == "#groeien") {...} и т. Д. Возможно, я вернусь к этому посту позже, после отпуска. Еще раз спасибо!
arvanderkamp 01 май 2014, в 06:58
0

«не работает» не описывает вашу проблему, но я рад, что вы разобрались со всеми проблемами.
Lajos Arpad 01 май 2014, в 22:16

Показать ещё 5 комментариев

Cameron Tinker · Answer 2 · 2014-04-29T17-28-00.000Z

Если вы переходите на другую физическую страницу, а не на виртуальную страницу, вам нужно будет обрабатывать хэш на новой странице. Вы должны были бы получить доступ location.hash или location.pathname и сделать что - то на основе хэш - значения. Вы можете справиться с этим так:

$(document).ready(function() {
    displayTab(location.hash);
});