jQuery向下滑动而不是向下滑动

“向下滑动”效果不起作用。它显示元素，但不显示“向下滑动”

HTML:

jQuery：

$('.options .editName a').on('click', function(e) {
    e.preventDefault();
    $('.name-edit').slideDown('slow');
});

---

结果：在表行中不支持动画，可以考虑在<代码> div <代码>中包装表，并在<代码> div 上应用动画。 来自“学习jQuery”

由于浏览器对其可见显示属性使用不同的值（表行和块），表行对动画造成了特殊的障碍。没有动画的.hide（）和.show（）方法始终可以安全地用于表行。从jQuery版本1.1.3开始，也可以使用.fadeIn（）和.fadeOut（）

---

你在和桌子打交道。。。切换到无表方法，它就会工作。 我用一个例子更新了你的小提琴：

Html

---

问题在于TR标签的性质。 slideDown适用于显示元素：块

只是为了好玩，如果你加上

tr{
    display: block;
}

在为.hidden添加css之前，您会意识到slideDown是有效的

---

请参见其他人提到的fiddle

，您无法使用当前的html结构。或者，您可以使用.fadeIn。

$('.options .editName a').on('click', function(e) {
    e.preventDefault();
    $('.name-edit').slideDown('slow');
});

<div class='settings'>
            <h4>Account Settings</h4>
      <div class="options">
        <span class="name username">Name</span>
        <span class="value">Robert Rocha</span>
        <span class="edit editName"><a href="#">Edit</a></span>
      </div>
      <div class="hidden name-edit">
        <div>
          <label for='fname'>First</label><br>
          <input type='text' name='fname' class='fname' id='fname'><br>

        </div>
      </div>
</div> 
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js'></script>

$('.options .editName a').on('click', function(e) {
    e.preventDefault();
    $(this).parent().parent().next('.name-edit').slideToggle('slow');
});

tr{
    display: block;
}