[心得] jQuery sub 介紹
本篇可以參考：
http://ithelp.ithome.com.tw/question/10090801
-----------------------------------
-----------------------------------
jQuery.sub() 是 jQuery 1.5 加入，專門針對一個特定情境用的，
基本上並不常用，但是當你需要時你會很感謝他！
這個情境是當你碰到有兩個不同的 plugin ，同時使用同一個 fn name 時。
像是這個問題提到的
http://0rz.tw/8VRC1
舉例遮住一個 dom 元件的畫面，有的 plugin 會複寫 $.fn.mask。
（假設是 pluginA ）
但是將 textbox 的內容作遮字或格式，也有人叫 $.fn.mask 。
（假設是 pluginB）
你有幾個方式可以解決這個困境：
1.修改原始碼，把其中一個 mask 改成 mask2 或者 input_mask 等其他名字，
避免衝突。
缺點：不好維護，而且如果有相依性（其他lib調用這裡的 mask ，）
你就要改一大票改不完了。
2.不爽不要用 （被拖走）
3.使用 jQuery.sub() (阿～救星來了）
以剛剛那個例子，我們的作法應該會像是這樣。
-----------------------------------
<script src="jquery.js" ></script>
<script src="pluginA.js" ></script> //assume jQuery.fn.mask is overwrited.
<script>
window.origJQuery = window.jQuery;
//overwrite the existing jQuery to apply following plugins
window.jQuery = $.sub();
</script>
//assume jQuery.fn.mask is overwrited , it will apply to sub() one .
<script src="pluginB.js" ></script>
<script>
var $b = window.jQuery;
window.jQuery = window.origJQuery;
</script>
-----------------------------------
(PS. 操作全域變數時都加上 window ，
是我個人偏好的習慣，讀起來比較順。）
雖然這段 code 看起來不算乾淨，不過這是不需要修改 plugin 最小的作法。
（最後面會介紹另一種作法）。
然後這樣作之後，你要怎麼操作呢？
透過不同的 jQuery context 查詢回來的，會對應到不同 plugin 。
-----------------------------------
$("#target").mask() //jQuery.fn.mask in plugin A
$b("#target").mask() //jQuery.fn.mask in plugin B
-----------------------------------
我知道講一堆抽象跟複雜的東西現在你應該還是滿頭問號，
所以我們照慣例還是程式碼會說話：
http://jsfiddle.net/2b6Pm/
你也可以改 plugin 傳入的 "jQuery" 改成自定義的，
就不用這麼麻煩改來改去的改到頭昏，
而且相依性的問題會比原本的好一點點（一點點啦XD）。
像是這個範例是不是看起來簡單多了呢？
但是需要改到 plugin 的 code 。
JS 只是工具，所以取捨就在你囉，考驗你的智慧，適當的選用吧！ ;)
http://jsfiddle.net/2b6Pm/1/
這個情境是沒撞到就沒事，一撞到就會很痛的問題，
所以還是知道一下 sub() 這函式 ，有利無害唷。 ;)
--
Life's a struggle but beautiful.
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 114.25.56.138
※ 編輯: TonyQ 來自: 114.25.56.138 (04/16 00:57)
推
04/16 11:32, , 1F
04/16 11:32, 1F
推
04/16 13:34, , 2F
04/16 13:34, 2F
推
04/16 18:23, , 3F
04/16 18:23, 3F
→
04/16 18:26, , 4F
04/16 18:26, 4F
推
04/16 18:50, , 5F
04/16 18:50, 5F