jQuery вопрос / ответ с использованием скрипки;запуск ответа «b» из HTML-элемента в ответе «a» - PullRequest
0 голосов
/ 15 июля 2011

Я не смог понять это, несмотря на то, что много часов возился, надеюсь, это было сделано много раз раньше! На моем тестовом сайте (http://www.sketch360test.co.uk/giclee.php) у меня есть макет вопроса / ответа, основанный на jQuery, который мне нравится по своему вкусу в его простой форме. Однако мне нужно вызвать некоторые строки ответов с использованием элементов которые появляются в ДРУГИХ ответах. Например, если вы выберете первую опцию «Жикле - процесс», там будет несколько элементов, таких как текст «read the blurb», который мне нужно для переключения строки ответа «blurb» div, и кнопку изображения «выберите свою бумагу», которая должна переключать строку ответа «документы».

Таким образом, в действительности изображение «выберите свою бумагу» будет выполнять ту же работу, что и кнопка триггера «документы» (было бы неплохо, если бы нажатие на изображение «выберите свою бумагу» могло также вызвать изменение фонового изображения кнопка «документы», которая существует в моем существующем jQuery, хотя я готов к тому, что это может быть слишком далеко!). Ниже приведен мой существующий jQuery, как я уже говорил, я возился с добавлением различных классов к новым элементам триггера, но пока не смог получить правильный результат - пока не испортил существующую функциональность. Любая помощь будет принята с благодарностью ...

jQuery.fn.fadeToggle = function(speed, easing, callback) {
    return this.animate({opacity: 'toggle'}, speed, easing, callback);
};

$(function() {
    $("#answer .views-row").hide();
    $("#question .views-row").click(function(){
        var i = $(this).index();
        $("#answer .views-row").eq(i).toggle("slow").siblings().hide();
    $(".question").css("background-image", "url(/img/bg/nav-giclee.png)").eq(i).css("background-image", "url(/img/bg/nav-down.png)");
    });
});

1 Ответ

0 голосов
/ 15 июля 2011

Я думаю, что этот пример jsFiddle (http://jsfiddle.net/alr3/LPNfZ/), который я собрал, ответит на ваш вопрос. Я не скопировал все ваши макеты, и я использовал списки вместо div, но этот ответ будет делать то, что вам нужно, даже используяиспользуемую вами методологию «показать и скрыть, используя соответствующий индекс в родительском».

Однако я бы предложил использовать конкретные имена для «заголовков» и «содержимого» / ответов, и тогда это будет действительнопросто, вы бы просто поместили событие клика на любую ссылку, чтобы показать другой контент, например

$("#my-image-that-now-opens-an-answer-id").click(function() { $("some-specific-header-id").click(); });
...