Question

我有javascript和HTML的问题。如果文本输入的值错误，我想弹出一条消息。

    $('input[name="login"]').blur(function() {
    $('.error:nth-child(2)').fadeIn('fast', function() {

    });
});

和HTML / PHP代码：

    echo "<div class=\"grid_2 alpha\">Nazwa użytkownika</div><div class=\"grid_2 omega register\">".form_input('login', set_value('login', ''))."</div>";
    echo "<div class=\"error grid_4\">Niepoprawna nazwa użytkownika.</div>";

我无法实现的是实际淡出这个小div。什么都没发生。这段代码有什么问题？

当我不使用时，一切都有效：nth-child（）。

Answer 1

如果没有看到更多代码，很难确定，但我感觉你所追求的是：

$(".error").eq(2).fadeIn("fast", function() {
    //Done!
});

eq只会匹配指定选择器的元素，而nth-child会查看所有兄弟姐妹。因此，上面的代码将选择匹配.error的第二个元素。如果您愿意，也可以使用:eq伪选择器：

$(".error:eq(2)").fadeIn("fast", function() {});

eq和nth-child之间的差异是混淆的常见原因。 jQuery docs帮助清理它：

：nth-child（n）伪类很容易与：eq（n）混淆，甚至虽然这两者可以导致显着不同的匹配元素。随着：n-child（n），所有孩子都被计算在内，无论他们是什么是，并且只有在匹配时才选择指定的元素选择器附加到伪类。使用：eq（n）仅选择器附属于伪类计算，不限于儿童选择任何其他元素，并选择第（n + 1）个（n为0）。

当然，我可能完全错了，当你发布更多代码时，我可能不得不删除这个答案！

Jquery nth-child fadeIn

1 个答案: