Question

我正在使用javaScript记住页面刷新后的切换状态。

代码在一个选项中正常工作（添加名称），但是当我添加另一个选项（添加电话）并更改第二个选项的变量时，就会出现冲突。

如果我有一个选项'可见'和其他'隐藏'，那么在页面刷新后它们都会变得可见。

我认为我没有正确编写javaScript。

CODE

<div class="toggle-1">
    <a>Add name</a>
    <div class="inner-1">
       <br>
        <legend>Name</legend>
        <input type="text">
    </div>
</div>
    <br> <br> <br>

<div class="toggle-2">
    <a>Add phone</a>
    <div class="inner-2">
       <br>
        <legend>code</legend>
        <input type="text">
    </div>
</div>

    $(function (){
        var toggle1=$('.toggle-1');
        var inner1=toggle1.find('.inner-1');
        if($.cookie('divState')=='visible')
            inner1.show();
        else
            inner1.hide();
        toggle1.find('a').click(function(){
            if(inner1.is(':visible'))
                $.cookie('divState', 'hidden');
            else
                $.cookie('divState', 'visible');
            inner1.toggle();
        });
    });


     $(function (){
        var toggle2=$('.toggle-2');
        var inner2=toggle2.find('.inner-2');
        if($.cookie('divState')=='visible')
            inner2.show();
        else
            inner2.hide();
        toggle2.find('a').click(function(){
            if(inner2.is(':visible'))
                $.cookie('divState', 'hidden');
            else
                $.cookie('divState', 'visible');
            inner2.toggle();
        });
    });

Answer 1

您使用完全相同的Cookie名称......

$.cookie('divState')

您需要为他们指定不同的名称，否则您将覆盖原始值

请记住切换状态JavaScript冲突

1 个答案: