jQuery的ul显示/隐藏功能 [英] jQuery show/hide feature broken from ul

问题描述

我正在尝试隐藏我的div，当完成时它们将包含内容.我有一个jsFiddle文件，其中一些编码还不完整，只是非常快速地编写了一下，以给您一个主意.

I'm trying to hide my divs which will have content in them when finished. I have a jsFiddle file and some of the coding is not complete, just wrote it very fast to give you an idea.

http://jsfiddle.net/vCZC7/

我相信ul正在使它无法正确创建.

I believe that the ul is making it not be created correctly.

推荐答案

小提琴中的html无效:您不应将相同的id属性分配给多个元素.如果您尝试执行类似$("#slidingDiv").hide();的操作，它将仅选择具有该ID的 first (在大多数浏览器中)元素来隐藏.

The html in your fiddle is invalid: you should not assign the same id attribute to multiple elements. If you try to do something like $("#slidingDiv").hide(); it will only select the first (in most browsers) element with that id to hide.

您还使用了".show_hide"类选择器，但是您的元素都没有该类.

Also you are using the ".show_hide" class selector but none of your elements have that class.

在单击处理程序中，您已经说过$(this).next("#slidingDiv").slideToggle();，但是.next()方法不会寻找具有提供的ID的下一个元素，如果该元素具有提供的ID，则它仅选择紧随其后的元素.

Within your click handler you've said $(this).next("#slidingDiv").slideToggle(); but the .next() method doesn't go looking for the next element that has the supplied id, it selects only the immediately following element if that element has the supplied id.

您还错误地使用了jsfiddle:您应该在JavaScript窗口中放置JavaScript代码，而不是<script>标签.您应该删除<script>标记，而是从左侧面板中选择所需的库，如下所示: http://jsfiddle.net/vCZC7/1/(您的小提琴在左侧选择了默认的Mootools库.)

Also you've used jsfiddle incorrectly: within the JavaScript window you are supposed to put JavaScript code, not <script> tags. You should remove the <script> tags and instead select the required library from the panel on the left, like this: http://jsfiddle.net/vCZC7/1/ (Your fiddle had the default Mootools library selected on the left.)

我发现您对所需行为的解释有些欠缺，但这是一个有用的小提琴，单击li元素可切换下面的div: http://jsfiddle.net/vCZC7/3/(注意:我更新了它以使用最新的jQuery，因为最简单的事情似乎是使用1.4版中引入的.index()方法语法而您只包含了1.3.2).

I found your explanation of the required behaviour somewhat lacking, but here is a working fiddle where clicking the li elements toggles the divs underneath: http://jsfiddle.net/vCZC7/3/ (note: I updated it to use the latest jQuery because the simplest thing seemed to be to use the .index() method syntax introduced in version 1.4 and you had only included 1.3.2).

这篇关于jQuery的ul显示/隐藏功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！