1

我在 JQuery 中使用 slideToggle() 来显示一个 div。但这不起作用。

我做了不同的测试，但没有任何效果......

我有这个 ：

<div class="domaine">
<a>1. Compétences Scientifiques Transversales</a>
<br>
<div class="ssdomaine" style="display: none;">
    <a>1.1. Sciences et techniques</a>
    <br>
    <div class="competence" style="display: none;">
        <a href="#">1.1.1. Génie thermique et thermodynamique</a>
        <br>
    </div>
</div>

这里只是一个包含单个“ssdomaine”的“domaine”，其中包含一个“competence”

但是我在一个数据库中提出了一个请求，该请求可以向我发送多个包含多个“ssdomaine”的“domaine”，其中包含多个“ssdomaine”。

我想制作一个 .slideToggle() 而不指定任何 id。

我的 JQuery 代码是：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script>
$(document).ready(function() {
   $('.ssdomaine').hide();
    $('.competence').hide();
   $('.domaine a').click(function() {
      $(this).next('.ssdomaine').slideToggle(1000);
      return false;
   });
   $('.ssdomaine a').click(function() {
          $(this).next('.competence').slideToggle(1000);
          return false;
    });
 });
</script>

我在这个链接中尝试了同样的方法：http: //jsfiddle.net/6GRJr/168/

它正在工作，但它只发生在 domaine、ssdomaine 和能力的一次出现上。

任何想法 ？

4

3 回答 3

2

它与height，看看这个小提琴http://jsfiddle.net/6GRJr/169/

更新

它不显示的原因competence是因为它在您加载表单时是隐藏的，而当您slideToggle在ssdomaine它上面进行操作时，它ssdomaine只会显示而不是权限

更新

这应该做到http://jsfiddle.net/6GRJr/172/

于 2012-11-21T13:37:55.907 回答
1

jQuery 的 slideToggle() 充其量是错误的。幸运的是，HTML5 中有一个新功能可以在没有 JavaScript 的情况下提供此功能！

查看新的 HTML5 标记：

http://www.w3schools.com/tags/tag_details.asp

于 2017-01-17T15:40:00.393 回答
0

.next仅查看直接兄弟，添加选择器仅检查该元素是否与选择器匹配，这.nextAll('.selector') 是可行的方法，但将返回元素集合，因此您可能希望使用限制集合.first()

$(document).ready(function() {
   $('.ssdomaine').hide();
    $('.competence').hide();
   $('.domaine a').click(function() {
      // next only looks at the immediate sibling, which in you code is a <br />
      //$(this).next('.ssdomaine').slideToggle(1000);


      // this would open all elements
      $(this).nextAll('.ssdomaine').slideToggle(1000);

或者

      // this would open this first instance of .ssdomaine
      $(this).nextAll('.ssdomaine').first().slideToggle(1000);

      return false;
   });
   $('.ssdomaine a').click(function() {
          $(this).next('.competence').slideToggle(1000);
          return false;
    });
 });
于 2012-11-21T14:18:09.953 回答