jQuery 爆冷门: sub

依照主题介绍 jQuery （我认为）冷门或者比较不为人知的 API。****
jQuery.sub() 是 jQuery 1.5 加入，专门针对一个特定情境用的，
基本上并不常用，但是当你需要时你会很感谢他！

这个情境是当你碰到有两个不同的 plugin ，同时使用同一个 fn name 时。

像是这个问题提到的
http://stackoverflow.com/questions/5740974/jquery-plugins-occupy-the-same-function-name-conflict

举例遮住一个 dom 元件的画面（假设是 pluginA ），有的 plugin 会複写 $.fn.mask ，
但是将 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;   window.jQuery = $.sub();//overwrite the existing jQuery to apply following plugins. </script><script src="pluginB.js" ></script> //assume jQuery.fn.mask is overwrited , it will apply to sub() one .<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() 这函式 ，有利无害唷。 ;)