带有jQuery手风琴的向导，上一个/下一个按钮 [英] Wizard with jQuery accordion, previous / next buttons

问题描述

我正在尝试在手风琴中制作一个向导.看我的代码:

I'm trying to make a wizard inside a accordion. Look at my code:

http://jsfiddle.net/NDncE/2/

我在做什么错了，我希望每个手风琴元素上的上一个和下一个按钮.

What am I doing wrong, I want the previous and next button on each accordion element.

推荐答案

可以在此处找到使用最新版本的jQuery和jQuery UI的正确解决方案:

The proper solution using the latest version of jQuery and jQuery UI can be found here:

http://jsfiddle.net/rmardeni/NDncE/49/

HTML

<div id="accordion">
    <h3><a href="#">1. Profilbilde</a></h3>
    <div>
        <p>
           test
        </p>
        <button class='next'>
            Next
        </button>
    </div>
    <h3>
        <a href="#">2. Organisasjon</a></h3>
    <div>
        <p>
            test
        </p>
        <button class='previous'>
            Previous
        </button>
        <button class='next'>
            Next
        </button>
    </div>
    <h3>
        <a href="#">3. Tjenestested</a></h3>
    <div>
        <p>
            test
        </p>
        <button class='previous'>
            Previous
        </button>
    </div>
</div>

jQuery代码

jQuery(document).ready(function(){
    $('#accordion').accordion();
    $('#accordion button').click(function(e) {
        e.preventDefault();
        var delta = ($(this).is('.next') ? 1 : -1);
        $('#accordion').accordion('option', 'active', (
             $('#accordion').accordion('option','active') + delta  ));
    });
});

这篇关于带有jQuery手风琴的向导，上一个/下一个按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！