Question

嗨朋友slideDown和slideUp函数无法使用我的代码。它似乎没有slideDown效果的隐藏行PLease帮助你们可以解决我的代码或 see fiddle here

HTML

<table>
<tr>
    <td colspan="2"><p>Logistics</p>
      <select name=" " >
        <option>one</option>
        <option>two</option>
        <option>three</option>
        <option>four</option>
        <option>Others</option>
      </select>
    </td>
  </tr>
  <tr>
    <td width="80%" colspan="2"><textarea name=" 5" rows="2" id=" 5" onblur="if (this.value=='') this.value = this.defaultValue" onfocus="if (this.value==this.defaultValue) this.value = ''">Others Details</textarea>
      </td>
  </tr>
</table>

SCRIPT

$('tr').has('textarea').hide();
$('select').on('change',function(){
    if($(this).val()=='Others')
    {
        //$(this).next('tr td').has('textarea').slideDown(200);
        $(this).parent('td').parent('tr').next('tr').slideDown(200);
        //alert('other')
        }
    else
    {
        //$(this).next('tr td').has('textarea').slideDown(200);
        $(this).parent('td').parent('tr').next('tr').slideUp(200);
        //alert('other')
        }
    })

Answer 1

您无法滑动表格行，因为您无法操纵它们的高度。 jQuery的动画依赖于具有高度和宽度的元素。

内联元素没有设置或设置这些尺寸，因此动画必须使它们成为块级元素。对这些元素使用常规的，非动画的hide和show可能更好

您还可以使用fadeIn和fadeOut。的 Demo

Answer 2

检查 demo jsFiddle

JQuery的

$('tr').not(':first').children('td').wrapInner('<div>');
$('select').on('change',function(){
    if($(this).val()=='Others')
    {
        $('td > div').slideDown(2000, function() {
            $(this).parent().slideDown(2000);
        });
    }
    else
    {
        $('td > div').slideUp(1000, function() {
            $(this).parent().slideUp();
        });
    }
});

slideDown，slideUp在jQuery中不起作用

2 个答案:

JQuery的