Closed. This question needs details or clarity。它当前不接受答案。 想改善这个问题吗?添加详细信息并通过editing this post阐明问题。 3年前关闭。 除了我发现不赞成使用toggle()之外,我的工作与我想要的完全相同(请参见下面的小提琴)。我想知道是否可以使用toggleClass()或hide()和show()来切换dropdownpanel的可见性。$("#dropdown").click(function() { $("#dropdownpanel").toggle();});$("#latinlink").click(function() { $("#sometext").hide(); $("#latin").show();});$("#back").click(function() { $("#latin").hide(); $("#sometext").show();});#dropdownpanel { width: 236px; height: 100vh; background: rgba(00, 00, 00, 0.55); color: #ffffff; position: fixed; top: 38px; left: 0px; display: none; padding: 5px;}#latin { width: 236px; height: 100vh; background: rgba(00, 00, 00, 0.55); color: #ffffff; position: fixed; top: 38px; left: 0px; display: none; padding: 5px;}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <button id="dropdown"> Dropdown </button> <div id="dropdownpanel"> <p id="sometext">Click <a href="#" id="latinlink">here</a> to read some latin... </p> </div> <div id="latin"> <button id="back"> Back </button> <br /> Lorem ipsum dolor sit amet, epicuri argumentum constituam eum ea. Munere aliquip te nec, at nec dicat fuisset offendit, quo an sonet honestatis. Tempor facete sadipscing te his. Nam vivendo postulant reprehendunt te, offendit principes pri ex, at causae oblique torquatos pro. <br /> <br /> Libris philosophia has eu, nam iriure alienum intellegam at. Nec appareat electram ne, amet nonumes per te. Usu eu nisl verterem, labore regione legimus in nam, vel saperet laboramus voluptatibus ut. Ad eam altera nemore. No nobis corpora pro, qui ex tale suas dissentias, et iisque omittam inciderint sit. Usu ut case menandri vituperata. </div>JSFiddle 最佳答案 当前行为是因为,当您单击#latinlink元素时,它会隐藏#dropdownpanel,因此,当您再次单击#dropdown按钮时,它将#dropdownpanel从隐藏状态切换为可见状态,这与按钮。根本不更改HTML的最简单方法就是更新#back单击处理程序以测试#dropdown当前是否可见:$("#dropdown").click(function() { if ($("#latin").is(":visible")) $("#dropdownpanel").hide(); else $("#dropdownpanel").toggle(); $("#latin").hide();});$("#latinlink").click(function() { $("#dropdownpanel").hide(); $("#latin").show();});$("#back").click(function() { $("#latin").hide(); $("#dropdownpanel").show();});#dropdownpanel, #latin { width: 236px; height: 100vh; background: rgba(00, 00, 00, 0.55); color: #ffffff; position: fixed; top: 38px; left: 0px; display: none; padding: 5px; }<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <button id="dropdown"> Dropdown </button> <div id="dropdownpanel"> <p>Click <a href="#" id="latinlink">here</a> to read some latin... </p> </div> <div id="latin"> <button id="back"> Back </button> <br /> Lorem ipsum dolor sit amet, epicuri argumentum constituam eum ea. Munere aliquip te nec, at nec dicat fuisset offendit, quo an sonet honestatis. Tempor facete sadipscing te his. Nam vivendo postulant reprehendunt te, offendit principes pri ex, at causae oblique torquatos pro. <br /> <br /> Libris philosophia has eu, nam iriure alienum intellegam at. Nec appareat electram ne, amet nonumes per te. Usu eu nisl verterem, labore regione legimus in nam, vel saperet laboramus voluptatibus ut. Ad eam altera nemore. No nobis corpora pro, qui ex tale suas dissentias, et iisque omittam inciderint sit. Usu ut case menandri vituperata. </div>或者,您可以更改HTML结构以将#latin div放在#latin中。关于javascript - jQuery结合toggle(),show()和hide(),我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/42288823/ 10-12 00:55