Question

我想在页面加载时显示import sys import hashlib import getpass def main(): print ('\nUser & Password Storage Program v.01\n') if input('The file will be modieifed if it exists.\nDo you wish to continue (Y/N): ') not in ('Y','y'): sys.exit('\nChanges were not recorded\n') user_name = input(str('Please Enter a User Name: ')) pwdinput = input("Now enter a password:").encode('utf-8') password = hashlib.sha224(pwdinput).hexdigest() try: f = open(passfile.txt,'a+') f.write(user_name + '\n') f.write(password + '\n') f.close() except: sys.exit('There was a problem writing to the file!') print ('\nPassword safely stored in passfile.txt.\n') main() service-specificBar-tab并隐藏正在运行的其他标签。但是，我不想工作的部分是当我点击该选项卡时，我希望其他三个选项卡的其余部分按HTML的顺序显示，然后当我再次单击第一个选项卡时，标签2,3和4关闭。我现在使用的方法是非常错误。当您单击serviceBarId1打开选项卡时，所有选项卡都会打开，但随后会消失 - 直到我添加后才会发生这种情况：

serviceBarId1

当我尝试关闭标签时，没有任何反应。

我做错了什么？

$("#serviceBarId1").click(function() {
    $("#serviceBarId2").hide(1000);
    $("#serviceBarId3").hide(1000);
    $("#serviceBarId4").hide(1000);
});

$("#serviceBarId1").addClass("active");
$("#serviceBarId2").hide();
$("#serviceBarId3").hide();
$("#serviceBarId4").hide();
$("#serviceBarId1").click(function() {
    $(".service-specificBar-tab").first().show("fast", function showNext() {
        $(this).next(".service-specificBar-tab").show("fast", showNext);
    });
});
$("#serviceBarId1").click(function() {
    $("#serviceBarId2").hide(1000);
    $("#serviceBarId3").hide(1000);
    $("#serviceBarId4").hide(1000);
});

#gray {
    background: #f9f9f9;
    width: 100%;
    height: 700px;
    position: relative;
}

#service-specificBar-container {
    position: relative;
    top: 50px;
    width: 100%;
    padding: 25px 0;
}

#service-specificBar {
    width: 100%;
    height: 100px;
    position: relevant;
}

.service-specificBar-tab {
    width: 25%;
    height: 100%;
    display: inline-block;
    margin: 0;
    padding: 0px;
    text-align: center;
    font-size: 1.6em;
}

.service-specificBar-tab:nth-child(odd) {
    background: #dbdbdb;
    transition: ease-in-out .3s;
    cursor: pointer;
}

.service-specificBar-tab:nth-child(even) {
    background: #FFF;
    transition: ease-in-out .3s;
    cursor: pointer;
}

#serviceBarId1:hover,
#serviceBarId2:hover,
#serviceBarId3:hover,
#serviceBarId4:hover {
    transition: ease-in-out .3s;
    color: #FFF;
}

#serviceBarId2:hover {
    background: #0085A1;
}

#serviceBarId3:hover {
    background: #a11c00;
}

#serviceBarId4:hover {
    background: #00a16d;
}


/*----Test for page swithces ----*/

#serviceBarId1.active {
    background: #a10085;
    color: #FFF;
}

#serviceBarId2.active {
    background: green;
}

Answer 1

在click事件中，您可以检查可见项目的数量。如果可见length的{{1}}为1，则显示兄弟姐妹，否则隐藏它们：

divs

<强> Fiddle Demo

使用.show / .hide和.next导致问题

1 个答案: