Typography

活版印字


  • Home
  • Archive
  • Categories
  • Tags
  •  

© 2020 alincode

Theme Typography by Makito

Proudly published with Hexo

JQuery Module Pattern

Posted at 2016-03-24 JQuery 

這個 Pattern 主要是可以區別出 Private 跟 Public 的變數跟函式,把不需要對外的資料封裝起來。

範例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
(function($) {

// link The Module Pattern
// https://learn.jquery.com/code-organization/concepts/
var member = (function() {

// 私有變數
var deleteMemberElement = '#deleteMember';
var memberNoElement = 'input[name=memberNo]';
var memberTypeElement = '#memberDetail select[name=memberType]';
var memberTypeSelectedElement = memberTypeElement + ' :selected';

// 私有函式
var deleteMember = function(e) {
e.preventDefault();
}

var checkMemberID = function(e) {
e.preventDefault();
}

var hello = function() {
alert('hello');
}

// 公開的 API
return {
init: function() {
$(deleteMemberElement).on('click', deleteMember);
$(memberNoElement).on('change', checkMemberID);
},
otherAPI: function() {
hello();
}
};
})();

member.init();
member.otherAPI();

}(jQuery));

資料來源

  • Code Organization Concepts

Share 

 Previous post: 取得其他 git remote branch Next post: ckeditor 換行語法調整 

© 2020 alincode

Theme Typography by Makito

Proudly published with Hexo