JQuery模糊函数（来自教程）

我正在学习本教程，教师进行得非常快，并且没有解释某些部分，所以我在Google上搜索大量文档，到目前为止它的表现还不错。有一件事我不明白为什么我的.on（'blur'，function（）{..，我需要在400ms的持续时间后包含function（）{}。为什么我不必包含function（） {}当我使用焦点函数时，如果是这样，那么这个函数的目的究竟是什么呢？教师只是输入了它，我不确定为什么。顺便说一句，我正在制作一个小型搜索引擎，教练正在经历如何做到这一点。JQuery模糊函数（来自教程）

$(document).ready(function(){ 

    var searchField = $('#query'); 
    var icon = $('#search-btn'); 

    $(searchField).on('focus',function(){ 

     $(this).animate({ 

      width:'100%' 

     },400); 

     $(icon).animate({ 
      right:'100px' 
     }, 400); 
    }); 

    $(searchField).on('blur', function(){ 
     if(searchField.val() == '') 
     { 
      $(searchField).animate(
       { 
       width:'45%' 
       },400,function(){}); 

      $icon.animate({ 
       right:'45%' 
       },400,function(){}); 


     } 

}); 

})

来源

2016-05-31 Jason Genova

您是否一直在观看教程？你确定教练以后不会填写这些功能吗？ – JJJ

哦不，我没有。好的电话......我想这些会在以后被其他东西填满吗？ –

该函数参数是可选的，但如果您提供它，则可以在动画完成时执行运行中的代码。 – trincot

我假定你的意思是空的功能块这里？：

$(searchField).animate(
    { 
     width:'45%' 
    },400,function(){}); // <-- in here

这是一个回调函数。由于动画是一个异步操作（WHI在这种情况下，ch应该需要400毫秒），它不会阻止代码等待它完成。所以如果你想在之后发生它会完成，它将会进入该功能块。

例如，考虑一下：

$(searchField).animate( { width:'45%' },400,function(){ console.log('first'); }); console.log('second');

由于代码是异步的，'second'实际上将'first'之前登录到控制台。这是因为当.animate()“异步执行它的事情”时，其余代码将继续执行。然后在该异步操作之后调用该回调。

由于功能块是空的，您实际上并不需要它，可能完全忽略它。但是，本教程中的教师可能会将其作为未来步骤的占位符。

来源

2016-05-31 14:00:03 David

非常感谢..这非常有道理。 –

我想知道，我们当然可以单独使用另一个函数，而不是在400ms后放置一个函数。不同之处在于，当作为参数放置（在400ms之后）时，函数将在动画之后直接出现？如果我们做了一个完全独立的函数来做同样的事情，它会马上发生？试图看看做回调函数的价值 –

@Munt：我不确定你在那里问什么。如果您将代码放入回调中，则会在异步操作完成后执行。（基本上''.animate（）'实现内部发生的最后一件事就是调用传递给它的任何函数）。如果您将* * .animate（）'后面的代码放在*之后，那么它将立即被调用并且不会等待动画完成。 – David

JQuery模糊函数（来自教程）

回答

相关问题