密碼的前后會(huì)留空，這可能是用戶(hù)的無(wú)心的行為，但是密碼確實(shí)又沒(méi)錯(cuò)，針對(duì)這樣的行為，開(kāi)發(fā)者應(yīng)該要判斷輸入值的前后是否有空白符、換行符、制表符這樣明顯的無(wú)意義的輸入值。

jQuery.trim（）函數(shù)用于去除字符串兩端的空白字符。

需要注意：

1）移除字符串開(kāi)始和結(jié)尾處的所有換行符，空格（包括連續(xù)的空格）和制表符（tab）。

2)如果這些空白字符在字符串的中間時(shí)，它們將被保留，不會(huì)被移出。

實(shí)際的用處:就是找在數(shù)組中的位置,具體可以用于判斷一些數(shù)據(jù)是否合理,比如手機(jī)號(hào)什么的

top(true,true)狀態(tài)下，點(diǎn)擊開(kāi)始動(dòng)畫(huà)，點(diǎn)擊暫停，再點(diǎn)擊開(kāi)始時(shí)，會(huì)有延時(shí)問(wèn)題?

這個(gè)并不是延遲，而是當(dāng)你點(diǎn)擊停止后會(huì)結(jié)束當(dāng)前正在正在執(zhí)行的動(dòng)畫(huà)，直接跳到動(dòng)畫(huà)執(zhí)行完畢的樣子，你再次點(diǎn)擊它依舊會(huì)從第一個(gè)動(dòng)畫(huà)開(kāi)始執(zhí)行，因?yàn)楝F(xiàn)在是第一個(gè)動(dòng)畫(huà)完成的樣子，所以這五秒是靜止不動(dòng)的，實(shí)際上它還處在第一個(gè)動(dòng)畫(huà)執(zhí)行期間，stop(true,true)是停止，并不是暫停

問(wèn)題：

這個(gè)step、progress有什么作用，怎么用的？arguments中的數(shù)組的值是從哪里傳遞過(guò)來(lái)的？動(dòng)畫(huà)step動(dòng)畫(huà)的顯示效果為什么會(huì)從100減到50，是怎么實(shí)現(xiàn)的？

回答：1、.animate(properties,options)中包含兩個(gè)參數(shù)，options參數(shù)包括幾種，其中step：規(guī)定每個(gè)動(dòng)畫(huà)的每一步完成之后要執(zhí)行的函數(shù)；progress：每一次動(dòng)畫(huà)調(diào)用的時(shí)候會(huì)執(zhí)行這個(gè)回調(diào)，就是一個(gè)進(jìn)度的概念。

2、arguments中數(shù)組值代表函數(shù)第幾個(gè)參數(shù)。這里arguments[1]代表第二個(gè)參數(shù)，則是代表fx。

3、這個(gè)程序沒(méi)有提供完整，在程序上面應(yīng)該會(huì)定義原先的塊級(jí)高度是100，動(dòng)畫(huà)中目標(biāo)高度是50，所以執(zhí)行動(dòng)畫(huà)時(shí)從100減到50。

4、顯示為1代表動(dòng)畫(huà)進(jìn)度完成到百分百。

step與progress怎么理解？有什么區(qū)別?

請(qǐng)大神賜教：step與progress怎么理解？有什么區(qū)別?

2016-09-29源自：jQuery基礎(chǔ)(四)—?jiǎng)赢?huà)篇 5-21799 瀏覽3 回答

最佳回答

2016-10-28

step這個(gè)屬性，研究了1天了，我來(lái)嘗試回答一下：

先引入一個(gè)概念：

一個(gè)動(dòng)畫(huà)執(zhí)行的進(jìn)度，可以用2個(gè)指標(biāo)來(lái)描述，一個(gè)是動(dòng)畫(huà)屬性的變動(dòng)值，另一個(gè)是動(dòng)畫(huà)在整個(gè)執(zhí)行過(guò)程的進(jìn)度

比如有一個(gè)動(dòng)畫(huà)效果：div向左移動(dòng)100px，用時(shí)200毫秒

那么我們?cè)趺疵枋鲞@個(gè)動(dòng)畫(huà)的每一步是什么呢？

我們可以說(shuō)：div向左每移動(dòng)1個(gè)px，可以看成動(dòng)畫(huà)執(zhí)行了一步；

同時(shí)我們也可以說(shuō)：我們把200毫秒分成100個(gè)時(shí)間段，動(dòng)畫(huà)開(kāi)始后，把每個(gè)時(shí)間段的流逝，看作動(dòng)畫(huà)執(zhí)行了一步。

要特別特別注意的是：在animate方法中，每一步具體是怎么分解的，不是由我們?cè)O(shè)定的CSS屬性值和動(dòng)畫(huà)時(shí)長(zhǎng)來(lái)決定的，是由系統(tǒng)來(lái)決定的。

舉個(gè)例子：

上面的代碼中，不論使用step屬性或者progress屬性都可以執(zhí)行。

你會(huì)發(fā)現(xiàn)，每次重復(fù)執(zhí)行，然而幾乎每一次 i 的值都有少量的差別，好了，結(jié)論就是：系統(tǒng)決定動(dòng)畫(huà)片段的數(shù)量。

上面扯的有點(diǎn)遠(yuǎn)了，不過(guò)對(duì)我們理解動(dòng)畫(huà)進(jìn)度這個(gè)概念還是有幫助的，現(xiàn)在可以來(lái)解釋 step 和 progress 的區(qū)別了

• 相同點(diǎn)：step 和 progress 這兩個(gè)屬性，都是在動(dòng)畫(huà)執(zhí)行的每個(gè)階段來(lái)調(diào)用函數(shù)，大部分情況下，使用任意一個(gè)，都可以得到我們想要的效果。

• 不同點(diǎn)，主要在fx這個(gè)參數(shù)上：

  step：?fx返回的是和css相關(guān)的屬性；

  progress：?fx返回的是動(dòng)畫(huà)進(jìn)度本身的屬性；

  
  

舉個(gè)例子：

運(yùn)行一下你會(huì)發(fā)現(xiàn)，雖然我們?cè)赿iv元素上添加了動(dòng)畫(huà)，但是實(shí)際執(zhí)行動(dòng)畫(huà)的元素卻是p

有意思吧，原因就在于，fx.elem = $("p"); ?將參與動(dòng)畫(huà)的元素改變成了$("p")

step的回調(diào)函數(shù)fx，還添加了很多屬性，可以參考jQuery的API文檔：http://www.css88.com/jqapi-1.9/animate/

不過(guò)progress的回調(diào)函數(shù)fx，就沒(méi)有這么多花樣了，因?yàn)樗祷氐木褪莿?dòng)畫(huà)進(jìn)度本身，也就是返回當(dāng)前的進(jìn)度值。代碼如下：

另外要說(shuō)明的是：step 函數(shù)只能返回我們?cè)诖a中設(shè)置的最后一條CSS屬性值，如：

以上代碼只能返回 opacity 屬性的相關(guān)值，而無(wú)法返回left的值，雖然這個(gè)值也參與了動(dòng)畫(huà)效果

1問(wèn)：noww和fxx接收的是哪兩個(gè)參數(shù)，沒(méi)有定義fxx這個(gè)函數(shù)啊。是怎么調(diào)用的？

2問(wèn)：arguments[1]的值是怎么來(lái)的？改成arguments[2]顯示的數(shù)值又什么值？改成arguments[3]后顯示undefined說(shuō)明數(shù)組里面只有三個(gè)值，這三值分別是什么

1. noww接收的是每次動(dòng)畫(huà)時(shí)height的值,fxw是指每個(gè)動(dòng)畫(huà)的每一步完成之后要執(zhí)行的函數(shù). step自動(dòng)執(zhí)行的這個(gè)函數(shù).

2. ?arguments對(duì)象是比較特別的一個(gè)對(duì)象，實(shí)際上是當(dāng)前函數(shù)的一個(gè)內(nèi)置屬性。arguments非常類(lèi)似Array，但實(shí)際上又不是一個(gè)Array實(shí)例.arguments對(duì)象的長(zhǎng)度是由實(shí)參個(gè)數(shù)而不是形參個(gè)數(shù)決定的。形參是函數(shù)內(nèi)部重新開(kāi)辟內(nèi)存空間存儲(chǔ)的變量，但是其與arguments對(duì)象內(nèi)存空間并不重疊.

   也就是說(shuō)此時(shí)的arguments[1]代表的是progress的進(jìn)度，而它是從0-1的,0代表開(kāi)始，1代表結(jié)束

fx在這里相當(dāng)于函數(shù)本身 你可以理解為this

step：規(guī)定每個(gè)動(dòng)畫(huà)的每一步完成之后要執(zhí)行的函數(shù)

progress：每一次動(dòng)畫(huà)調(diào)用的時(shí)候會(huì)執(zhí)行這個(gè)回調(diào)，就是一個(gè)進(jìn)度的概念

注意：CSS 樣式使用 DOM 名稱(chēng)（比如 "fontSize"）來(lái)設(shè)置，而非 CSS 名稱(chēng)（比如 "font-size"）。

var $aaron = $("#aaron"); 這句的意思:

就是將dom元素轉(zhuǎn)化為jQuery對(duì)象，使之能用jQuery中的各種方法函數(shù)，如果不轉(zhuǎn)化就無(wú)法使用jquery

jQuery只包含了兩個(gè)緩動(dòng)方法：swing和linear。linear方法提供了一個(gè)穩(wěn)定的動(dòng)畫(huà)，以使得動(dòng)畫(huà)的每個(gè)步驟都是相同的(例如，如果要讓一個(gè)元素以逐漸變化的方式穿過(guò)屏幕，每一步的距離和前一步都是相同的)。swing要更加動(dòng)態(tài)一些，隨著動(dòng)畫(huà)的開(kāi)始變得更加快一些，然后再慢下來(lái)。swing是一個(gè)常用設(shè)置，因此，如果沒(méi)有指定任何緩動(dòng)，jQuery會(huì)使用swing方法。

只是兩個(gè)代表不同動(dòng)畫(huà)過(guò)程的參數(shù)而已。如果你需要查看更多的動(dòng)畫(huà)，jq有個(gè)專(zhuān)門(mén)的動(dòng)畫(huà)庫(kù)。

操作元素的顯示和隱藏可以有集中方法：

例如：1）、改變樣式display為none；

? ? ? ? ? 2）、設(shè)置位置高度為0；

? ? ? ? ? 3）、設(shè)置透明度為0；

上述三種方法都能達(dá)到元素隱藏/顯示的目的；

而針對(duì)這樣的處理，jQuery提供了以下的方法：show/hide，slidedown/slideup、fadein/fadeout。除此之外，還引入了toggle：切換顯示與隱藏效果、 ? ? ? ? ? ? ? ? ? ? ? ? ? ?slidetoggle：切換上下拉卷滾效果、 ? ? ? ? ? ? ? ? ? ? ? ? ? ?fadetoggle：切換淡入淡出效果

這三種切換方法。

回調(diào)函數(shù)的 會(huì)執(zhí)行兩次

有兩個(gè)p元素，所以執(zhí)行兩次回調(diào)函數(shù)，(可以刪掉一個(gè)p試一試)

duration都可以傳入什么參數(shù)（除時(shí)間數(shù)值外）

:"slow", "normal", or "fast" ??

fadeOut在淡出過(guò)程中不改變高度和寬度, 但是淡出結(jié)束后元素會(huì)隱藏, 隱藏之后就不占空間

異步和同步最初是從進(jìn)程工作的概念里面延伸出來(lái)的。在進(jìn)程里面，有進(jìn)程之間相互工作相互協(xié)作的情況發(fā)生。比如，有兩進(jìn)程A和B，進(jìn)程A和進(jìn)程B相互獨(dú)立，互不干擾。他們各自獨(dú)立工作，各干各的，兩者之間的任何操作都不會(huì)對(duì)彼此產(chǎn)生影響，這就是異步操作；而同步呢？假設(shè)這個(gè)時(shí)候有個(gè)作業(yè)，需要進(jìn)程A和B一起協(xié)作完成，因此為了能順利完成這個(gè)作業(yè)，進(jìn)程A和進(jìn)程B就必須要相互制約，相互通信協(xié)作。比方進(jìn)程A完成了某個(gè)事情后通知進(jìn)程B才能繼續(xù)接下來(lái)的任務(wù)，而有些工作進(jìn)程B完成后也要通知進(jìn)程A才能繼續(xù)它接下來(lái)的任務(wù)。因此這就叫同步。

簡(jiǎn)單來(lái)說(shuō)，就是打電話(huà)(同步)和發(fā)信息(異步)的區(qū)別