本文介绍了带有jQuery手风琴的向导,上一个/下一个按钮的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

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手风琴的向导,上一个/下一个按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-29 16:38