Question

我有一个jquery动画功能来为使用

指定的列表设置动画

    $li = $("ol#update > li");

动画功能

function animate_li()
{
   $li.filter(':first')
      .animate({
         height:  'show',
         opacity: 'show'
      }, 250, function(){
        animate_li();
      });
    $li = $li.not(':first');
}

现在我想参数化我做过的animate_li函数：

function sp_animate_li(sp)
{
    console.log ( $li );
    function animate_li()
    {
        $li.filter(':first')
        .animate({
         height:  'show',
         opacity: 'show'
        }, sp, function(){
            animate_li();
        });
        $li = $li.not(':first');
    }
}

但现在我无法使用通话

获得任何动画

sp_animate_li(100);

任何帮助

感谢

Answer 1

你没有调用内部函数，也没有返回它，所以你实际上不能调用它。试试这个：

function sp_animate_li(sp)
{
    console.log ( $li );
    function animate_li()
    {
        $li.filter(':first')
        .animate({
         height:  'show',
         opacity: 'show'
        }, sp, function(){
            animate_li();
        });
        $li = $li.not(':first');
    }
    return animate_li;
}

var inner = sp_animate_li(100);
inner(); // calls the inner function

Answer 2

为什么不将您的功能定义为：

function animate_li($li, sp)
{
   sp = sp || 250;
   $li.first()
      .animate({
            height:  'show',
            opacity: 'show'
          }, 
          sp, 
          function(){
              animate_li($li.not(':first'), sp);
          }
      );
}

这也避免了使用更高范围的变量，这会让人感到困惑......

更新：修正了递归通话。

Answer 3

难怪，因为任何地方都没有调用animate_li。为什么不将参数添加到animate_li而不是包装它？

Answer 4

function animate_li( sp)
{
   sp = sp || 250;
   $li.filter(':first')
      .animate({
         height:  'show',
         opacity: 'show'
      }, sp, function(){
        animate_li( sp);
      });
    $li = $li.not(':first');
}

参数化jquery函数

4 个答案: