2

我是 JQuery 的新手，并且对如何让 JQuery 在用户离开当前页面然后返回时记住表单上元素的显示/隐藏状态感到困惑。即，当他们从下拉问题中进行选择时，会显示第二个问题（文本框），他们输入了答案，然后单击内置按钮转到下一页，然后单击按钮返回。

使用下面的代码，问题 IPQ_OTHRES 在当前页面的加载时被隐藏，因此很明显，当从下一页导航回来时，尽管在上一个下拉问题中进行了选择，但它再次被隐藏。IPQ_OTHRES 设置为在用户从下拉菜单问题 IPQ_THREE 中选择“N”时显示：

// Controls the show/hide of Other Resident Country based on answer to IPQ_THREE

        $('#IPQ_OTHRES').hide().removeClass('mandatoryInput');
        $('#IPQ_OTHRES_DIV').hide();

        $('#IPQ_THREE').change(function(){
            var IPQ_THREEVal = $('select[name=IPQ_THREE] option:selected').val();

                if (IPQ_THREEVal == "N"){
                        $('#IPQ_OTHRES_DIV').show()
                        $('#IPQ_OTHRES').show().addClass('mandatoryInput');
                    } else if (IPQ_THREEVal == "Y"){
                        $('#IPQ_OTHRES_DIV').hide()
                        $('#IPQ_OTHRES').hide().removeClass('mandatoryInput');
                    } else {
                        $('#IPQ_OTHRES_DIV').hide()
                        $('#IPQ_OTHRES').hide().removeClass('mandatoryInput');
                }
            });

我一直在阅读有关 JQuery cookie 和 localStorage 作为可能的解决方案。到目前为止，我最接近的答案来自这个问题帖子：Jquery show/hide resetting when page reloads

但它使用基于单选按钮而不是下拉菜单的显示/隐藏。我被告知我的前两行需要他们自己的“if..else”语句来获取 IPQ_THREE onload 的值并相应地显示/隐藏。我试过这样做并且被卡住了。任何人都可以帮忙吗？我真的需要对此进行排序，以便将其应用于其他元素。

非常感谢，

标记。

4

1 回答 1

1

你在这里有两个选择

  1. 使用像数据库这样的服务器端技术来记住以前的状态

  2. 使用客户端技术

在客户端有两种方法可以做到这一点

Cookie
使用 cookie 来存储值（像隐藏/显示特定元素的状态值），因为您使用的是 jQuery，所以您可以使用像这样的 cookie 库

webstorage
如果您只支持现代浏览器（html5），那么您可以考虑webstorage 之类的会话存储

于 2013-06-20T00:51:10.873 回答