开发者

Multipart Form - jQuery

开发者 https://www.devze.com 2023-01-03 10:40 出处:网络
I understand that are great plugins for auto-creating multi-part forms but my requirement is pretty simple and basic:

I understand that are great plugins for auto-creating multi-part forms but my requirement is pretty simple and basic:

html:

<form action="">
    <fieldset class="step step1">
        fields ...
        <button class="continue">Continue</button>
    </fieldset>
    <fieldset class="step step2">
        fields ...
        <button class="back">Back</button>
        <button class="continue">Continue</button>
    </fieldset>
    <fieldset class="step step3">
        fields ...
        <button class="back">Back</button>
        <button class="submit">Submit</button>
    </fieldset>
</form>开发者_如何转开发

I want to show only one step fieldset at a time and slide (left to right and vice versa) using continue/back buttons.

I'd appreciate any help.

Thanks!


$('.step1').siblings().hide(); // hide all except step 1

$('.continue').click(function(){
   $(this).closest('.step').hide().next('.step').show();
   return false;
});
$('.back').click(function(){
   $(this).closest('.step').hide().prev('.step').show();
   return false;
});

simple demo

0

精彩评论

暂无评论...
验证码 换一张
取 消