Span单击查找下一个div

Span单击查找下一个div

本文介绍了jQuery Span单击查找下一个div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我尝试从我单击的跨度范围中切换div类

I try to toogle div class from a span click i tried

$(this).closest(".div").find(".list-type-demandes").toggle();

但是它不起作用.

如果我使用:

$(".list-type-demandes").toggle();

这是可行的,但它向我显示了两个div,我需要显示"this"范围中的div

it's works but it's showing me the two div and i need to display the div from "this" span

此处HTML:

<label style="color: #1c5081">
        <span id="toolbar-open" name="toolbar_open" class="toogle-toobar-open" onclick="toogleListTypeDemande(this)"><b>+</b>
        </span> Organisation, support et services
      </label>

      <div class="list-type-demandes" style="padding-left: ; display: none">
         <label style="display: inline">
         <input type="radio" class="checkbox_type_demande" data-appel-projet="474" name="appel_projet[type_demande_list]" value="54" id="appel_projet_type_demande_list_54"> Architecture d'entreprise
        </label>
      </div>

      <label style="color: #1c5081">
        <span id="toolbar-open" name="toolbar_open" class="toogle-toobar-open" onclick="toogleListTypeDemande(this)"><b>+</b></span> Applications
      </label>


      <div class="list-type-demandes" style="padding-left: ; display: none">
        <label style="display: inline">
        <input type="radio" class="checkbox_type_demande" data-appel-projet="474" name="appel_projet[type_demande_list]" value="52" id="appel_projet_type_demande_list_52"> Système d'information activités recherche
        </label>
      </div>

此处是脚本:

function toogleListTypeDemande(element) {
        $(this).closest(".div").find(".list-type-demandes").toggle();
    }

推荐答案

您只需修改toogleListTypeDemande(element)一点.

Javascript提供了属性 nextElementSibling 来获取下一个html元素.不幸的是,您的span元素没有下一个兄弟姐妹.因此,我们需要向后移动一个节点以获取其父节点 element.parentNode -这是标签-然后从那里下一个兄弟节点是div.

Javascript offers the attribute nextElementSibling to get the next html element. Unfortunately there is no next sibling to your span element. So we need to travel one node back to get it's parent element.parentNode - which is the label - and from there the next sibling is the div.

function toogleListTypeDemande(element) {
        $(element.parentNode.nextElementSibling).toggle();
    }

这篇关于jQuery Span单击查找下一个div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-19 08:59