代码之家  ›  专栏  ›  技术社区  ›  Victor Bjelkholm

jQuery选择器问题

  •  2
  • Victor Bjelkholm  · 技术社区  · 15 年前

    HTML格式:

    <input type="text" class="text" name="left" style="width:100%;"/>
    <input type="submit" class="btn" value="Submit" />
    <div class="regler">Regler</div>
    

    jQuery查询:

    $("input.text").focus(function () {
         $(this).animate({width:'80%'},'slow',function(){
             $(this).next('input.btn').fadeIn('Slow');
         });
         $(this).next(".regler").slideDown('Slow');
    });
    $("input.text").blur(function () {
         $(this).next('input.btn').fadeOut('Slow',function(){
             $(this).prev().animate({width:'100%'},'slow');
         });
         $(this).next(".regler").slideUp('Slow');
    });
    

    .regler {
     display: none;  
    }
    
    input.btn {
     display: none;  
    }
    

    jQuery位于脚本中的HTML标记之后。

    $(this).next(".regler").slideDown('Slow'); $(this).next(".regler").slideUp('Slow');

    谢谢你的回答,维克多。

    1 回复  |  直到 15 年前
        1
  •  2
  •   Kobi    15 年前

    next 只是在寻找下一个元素。自 this 文本框在您的上下文中,它没有下一个 .regler . 如果这些标签包装在父容器中,请尝试以下操作:

    $(this).siblings(".regler").slideUp('Slow');
    

    $(this).next().next(".regler").slideUp('Slow');