JavaScript、jQuery、HTML5、Node.js執行個體大全-讀書筆記3

來源:互聯網
上載者:User

JavaScript、jQuery、HTML5、Node.js執行個體大全-讀書筆記3

技術很多,例子很多,只好慢慢學,慢慢實踐!!現在學的這本書是【JavaScript實戰----JavaScript、jQuery、HTML5、Node.js執行個體大全】

JavaScript、jQuery、HTML5、Node.js執行個體大全-讀書筆記2

3.3 響應滑鼠動作

圖3-2的效果已經有了,需要滑鼠來操作展示想看的照片,這就需要在相應的地方加上事件。

3.3.1 響應小照片單擊動作

在3.2.3的代碼裡提供了顯示小圖列表的eg.showThumb()方法,在單擊小圖片時要顯示大圖片,這需要調用eg.showBig()方法,只有在單擊小圖片的時候響應單擊事件才行,所以需要用eg.addListener()方法來實現,具體代碼見【範例3-4】。

【範例3-4 響應小照片單擊動作】

1.eg.showThumb = function(group){2.var ul = eg.$("smallPhotosList");3.ul.innerHTML = ''; //每次顯示時要清空舊的內容4. var start = (group-1)*eg.groupSize; //計算需要的data資料的開始位置5. var end = group*eg.groupSize //計算需要的data資料的結束位置6. for(vari=start;(i【範例3-4】中第9行就是響應小照片單擊動作的代碼,這裡使用了一個閉包,即一個自調用的匿名函數。(function(){})()是最簡單的閉包。大括弧的內容會順序執行。如果去掉第9行和第14行代碼,那麼會發現始終顯示當前組照片中的最後1張,在for語句體裡一般要用閉包把變數值傳到內部的綁定事件裡。

最具士兵突擊實戰類型的JavaScript


聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.