0

カスタム関数のコールバックが機能していません。誰か助けてください。

<html>
<body>
<script src='jquery-1.8.2.js'></script>
<script>
$(document).ready(function(e){
  function cb(){
    alert('animation finish');
  }
  $('button').bind({
    'click':function(e,cb){
        e.preventDefault();
        $('div').animate({'height':200,'width':200},1000);
        cb();
     }
  })
})
</script>
<style>
div{
  height:5px;width:5px;background-color:yellow;
}
</style>

<button>click me</button>
<div></div>

</body>
</html>

編集：.animate(...,1000,function(){...}) 行を使用 できません

$('div').animate({'height':200,'width':200},1000);

実行中の他の関数を表すだけです。これは比較的複雑で、条件が多く、さまざまなパラメーターに応じてさまざまなアニメーションが呼び出されます。

基本的に、これらのアニメーションがすべて終了したら、終了関数cb()を実行します。私が問題を抱えているところです。

たぶん、このようなものが適切でしょう：

<script>
$(document).ready(function(e){
  var status=0;
  var tmp1=2;tmp2=7;
  function cb(){
    alert('animation finish');
    console.log(status);
  }

  function do_func1(){
     status = tmp1+tmp2;
     $('#ele1').animate({'height':200,'width':200},1000);
  }
  function do_func2(){
     status = tmp1*tmp2;
     $('#ele2').animate({'height':300,'width':300},2000);
  }
  function do_func3(){
     status = tmp1+tmp1;
     $('#ele3').animate({'height':400,'width':400},500);
  }

  function func1(){
     if('a'=='b'){
         do_func1();
     }else if('a'=='c'){
         do_func2();
     }else{
         do_func3();
     }
  }

  $('button').on({
    'click':function(e,cb){
        e.preventDefault();
        func1();
        cb();
     }
  })
})
</script>
4

3 に答える 3

1

これを試して ：

$(document).ready(function (e) {
  $('button').bind({
    'click': function (e) {
        $('div').animate({
            'height': 200,
            'width': 200
        }, 1000, function () {
            cb()
        });
        e.preventDefault();
    }
  })
})

function cb() {
alert('animation finish');
}

例: http://jsfiddle.net/xP25Q/2/

于 2013-01-31T12:57:55.290 に答える
0

あなたはこのようなことをすることができます

  <script>

    function cb(){
        alert('animation finish');
    }

    //-----------------------
    $(function()
      {
        $('button').on('click',function(e)
          {
              e.preventDefault();
              var steps=0;
              var totalSteps=5;    // for example

              var checking=setInterval(function()
                                       {
                                         if(steps===totalSteps)
                                         {
                                           cb();
                                           clearInterval(checking);
                                         }
                                       },30);

            $('div').animate({'height':200,'width':200},1000, function(){steps++;});
            $('div').animate({...  another animation  },1000, function(){steps++;});
            ...
            $('div').animate({...  another animation  },1000, function(){steps++;});


         })  // ..on
    }) // ready function
 </script>

また、を必要に応じて変更step++し、チェック関数内に適切な条件を記述して、それに基づいて動作させることもできます...

于 2013-01-31T16:18:59.773 に答える
0

クリックイベントハンドラーで以前に定義したものではなく、イベント提供のコールバック関数を呼び出しています。

メソッドを呼び出す場合は、イベント ハンドラーでパラメーターの名前を変更するか、関数の名前を変更してメソッド呼び出しを変更します。

于 2013-01-31T12:51:05.450 に答える