jQuery - 我没有找到合适的孩子

时间:2013-05-21 01:31:41

标签: jquery parent-child css-selectors

因此,当我点击.click()时,我想在特定<a>.glossNav内的.words假冒.letter事件。

以下是我的尝试:

$(".letter").click(function(){
    var whichLetter = $(this).children("span").text();
    var selectedGloss = "#glossary-" + whichLetter;

    $(".words").fadeOut(200);
    $('.letter').removeClass('underline');

    $(selectedGloss).delay(200).fadeIn(200);
    $(this).addClass('underline');

      if($(selectedGloss).children(".glossNav").length > 0) // There isn't always a nav.
      {
            alert("Yippee!");
            $(selectedGloss).children(".glossNav").first().click();
      }
});

“Yippee!”成功提醒。

这是我的导航HTML(这是一个词汇表构建):

<div id="modelglossary"><div class="letterBar">
    <a href="javascript:void(0)" class="letter" id="selector-A">
        <span>A</span>
    </a>
    <a href="javascript:void(0)" class="letter" id="selector-B">
        <span>B</span>
    </a>
    <a href="javascript:void(0)" class="letter" id="selector-C">
        <span>C</span>
    </a>
.... and so on
</div>

以下是HTML的大部分内容:

<div class="words" id="glossary-S">
    <div id="s-page-1" class="glossPage">
        <span class="glossBlock">
            <strong>Zedcard</strong> - See <a class="wordRef" href="javascript:void(0)">Composite Card</a>.
        </span>
        <span class="glossBlock">
            <strong>Senior model</strong> - A senior model is a professional model in his 40s/50s/60s. As the average age is constantly rising, the advertisements go back more and more to older models to approach their target group. A senior model often has a good book as they can show a lot of experience or after easily being booked for ads they get publications from the beginning on.
        </span>
        <span class="glossBlock">
            <strong>Set</strong> - This is where the action of shoot takes place usually within a professional studio or within a location. It includes all the elements which make the shoot; for example the lighting, camera, art direction and art directed scenery.
        </span>
        <span class="glossBlock">
            <strong>Shooting</strong> - Shooting in general means the implementation of photo or film shoots.
        </span>
    </div>
    <div id="s-page-2" class="glossPage">
        <span class="glossBlock">
            <strong>Stock Photos</strong> - Stock photography is the supply of photographs licensed for specific uses. It is used to fulfill the needs of creative assignments instead of hiring a photographer. Today, stock images are usually presented in searchable online databases, where they are then purchased and delivered online. Often, they are produced in studios using a wide variety of models posing as professionals, stereotypes, expressing stereotypical emotions and gesticulations or involving pets.
        </span>
        <span class="glossBlock">
            <strong>Stylist</strong> - The stylist is in charge of the outfit of the model and discussing at length with the photographer or director, about theme of the shoot.
        </span>
    </div>
    <div class="glossNav">
        <a href="javascript:void(0)" page="s-page-1">1</a>
        <a href="javascript:void(0)" page="s-page-2">2</a>
    </div>
</div>

2 个答案:

答案 0 :(得分:4)

我认为您的选择器中缺少a。因为.glossNav是div而不是<a> ..

像这样:$(selectedGloss).find(".glossNav a").first().click();

您应该使用.find()而不是.children(),因为它只选择直接子元素,而不是您的情况......:)

查看我的编辑..

答案 1 :(得分:0)

您正在使用.first()。如果你的if语句是正确的,那么:

$(selectedGloss).children(".glossNav").first().click();

将在第一个 glossNav 类上触发click事件,该类是selectedGloss选择器的子级,而不是其中的第一个锚。您想要使用的是选择第一个锚点以及从多个深层选择glossNav。

if ($(selectedGloss + ">.glossNav").length > 0) {
    $(selectedGloss + ">.glossNav a").first().click();
}