大佬教程收集整理的这篇文章主要介绍了jquery hide / show两个div不起作用,或许与jqueryui手风琴有冲突？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
这是相关的html：
<html><head> <link href="jquery/css/vp/jquery-ui-1.9.1.custom.min.css" rel="stylesheet" type="text/css" /> <script src="jquery/js/jquery-1.8.2.js"></script> <script src="jquery/js/jquery-ui-1.9.1.custom.min.js"></script> <script src="jquery/development-bundle/external/jquery.bgiframe-2.1.2.js"></script> </head> <body> <div id="pagewrapper" > <div id="mainteam" > <!-- First DIV with an accordion inside --> <div id="vpteamcontainer"> <div id="accordion"> <h3>Section 1</h3> <div><p>Section 1 Content</p></div> <h3>Section 2</h3> <div><p>Section 2 Content</p></div> </div> </div> <!-- Second DIV with another accordion inside --> <div id="vpadvisorscontainer"> <div id="accordion2"> <h3>Section 1-2</h3> <div><p>Section 1-2 Content</p></div> <h3>Section 2-2</h3> <div><p>Section 2-2 Content</p></div> </div> </div> <!-- Div containing the two href links to show/hide the above divs --> <div id="somediv"> <ul class = "someULclass"> <li ><a href="#" id="vpteam" class="somelinkclass">Show First div and Hide Second div</a></li> <li ><a href="#" id="vpadvisors" class="somelinkclass">Show Second div and Hide First div</a></li> </ul> </div> </div> </div> </body> </html>
这是我所包含的上述DIVS(剥去宽度,高度,边框等)的相关CSS,因为可能父div之一的css参数可能会影响我无法显示/隐藏的div：
#pagewrapper { position:relative; float:none; margin-left:auto; margin-right:auto; display:block; } #mainteam { position:relative; float: left; } #vpteamcontainer { display:block; } #vpadvisorscontainer { display:none; }
所以我有javascript调用两个手风琴(#accordion和#accordion2,并且工作得很好,然后是javascript,当点击链接时尝试显示和隐藏两个div :(代码编辑试图保持简短) ：
<!-- START JQUERY accordions --> <script type="text/javascript"> $(function() { $( "#accordion" ).accordion({ collapsible: true,heightStyle: "fill" }); }); </script> <script type="text/javascript"> $(function() { $( "#accordion2" ).accordion({ collapsible: true,heightStyle: "fill" }); }); </script> <!-- END JQUERY accordions --> <!-- START JQUERY SHOW HIDE --> <script type="text/javascript"> $( "#vpteam" ).click(function(){ $( "#vpteamcontainer" ).show(); $( "#vpadvisorscontainer" ).hide(); }); $( "#vpadvisors" ).click(function(){ $( "#vpteamcontainer" ).hide(); $( "#vpadvisorscontainer" ).show(); }); </script> <!-- END JQUERY SHOW HIDE -->
注意：我还有javascript来显示两个模式对话框,它们在两个单独的href链接调用的对话框(jqueryui对话框)中的iframe中显示一个html页面.我把它保留在这里因为它看起来不相关,除了在这里的某个地方我看到一个项目讨论如何淡化效果(用于显示和关闭对话框),与show / hide有一些问题).
结果：
1-手风琴生成相应的div并按预期工作.
2-显示/隐藏链接什么都不做.
3-我尝试过使用.css(“display,none”)和.css(“display.block”),以及.css(“visibility,visible”)和.css(“visibility,hidden”)而不是show()和hide(),无论我做什么,我都无法获得任何工作选项.
也许在我的解释中我也过于明确或冗长,如果是这样,我道歉.
在我写这篇文章时,我想知道问题是否与所包含的手风琴有关,或者它是否与href链接有关,以及我如何尝试执行显示和隐藏div的javascripts？
感谢任何和所有给我一些建议
以上是大佬教程为你收集整理的jquery hide / show两个div不起作用,或许与jqueryui手风琴有冲突？全部内容，希望文章能够帮你解决jquery hide / show两个div不起作用,或许与jqueryui手风琴有冲突？所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。