Question

我有3个隐藏字段的表单。当我点击按钮

<div class="buttons">
  <button id="but-1">1</button>
  <button id="but-2">2</button>
  <button id="but-3">3</button>
  <button id="but-4">4</button>
</div>

某些字段会隐藏一些节目

我的表单

<div class="form">
  <div class="pass-1 form_pass">    
    <p><span>Pass1:</span><input id="catalogs_pass_1" name="catalogs[pass_1]" type="text" /></p>
  </div>
  <div class="pass-2 form_pass" style="display: none;">
    <p><span>Pass2:</span><input id="catalogs_pass_2" name="catalogs[pass_2]" type="text" /></p>
  </div>
  <div class="pass-3 form_pass" style="display:none;">
    <p><span>Pass3:</span><input id="catalogs_pass_3" name="catalogs[pass_3]" type="text" /></p>
  </div>
  <div class="pass-4 form_pass" style="display:none;">
    <p><span>Pass4:</span><input id="catalogs_pass_4" name="catalogs[pass_4]" type="text" /></p>
  </div>
  <div class="form_pass">
   <p><span>Phone:</span><input id="catalogs_phone" name="catalogs[phone]" type="text" /></p>
   <p><span>Email:</span><input id="catalogs_email" name="catalogs[email]" type="text" /></p>
   <p><input class="submit-rez" id="catalogs_submit" name="commit" type="submit" value="submit" /><p>
  </div>

一切正常，但是当用户没有通过验证时，对字段页面的刷新和所有显示的字段都会消失。如何保存所有显示的字段？

http://jsfiddle.net/dVFaV/98/

我使用了Cookie插件，只为一个按钮创建了保存字段。如何为其他三个按钮创建保存cookie？

感谢您的建议！

Answer 1

试试这个

$(document).ready(function () {
    $('#but-1').click(function () {
        $('.pass-1').fadeIn(300);
        $('.pass-2').fadeOut(100);
        $('.pass-3').fadeOut(100);
        $('.pass-4').fadeOut(100);
        $.cookie('content1', 1);
    });

    $("#but-2").click(function () {
        $(".pass-2").show();
        $(".pass-3").hide();
        $(".pass-4").hide();
        $.cookie('content1', 2)
    });
    $("#but-3").click(function () {
        $(".pass-2").show();
        $(".pass-3").show();
        $(".pass-4").hide();
        $.cookie('content1', 3)
    });
    $("#but-4").click(function () {
        $(".pass-2").show();
        $(".pass-3").show();
        $(".pass-4").show();
        $.cookie('content1', 4)
    });

    if ($.cookie('content1')) {
        var pass = parseInt($.cookie('content1'));
        for(var i = 1; i <= pass; i++) {
           var str = "pass-"+i;
            $("."+str).show();
        }
    };
});

Fiddle

注意：我还修改了jquery.cookies网址。不要从github加载。这将为您提供纯文本文件。

刷新页面后保存表单字段

1 个答案: