I've ran into a problem using jquery expose plugin alongside Masked Input plugin.
The problem is they both occupy $.mask
function which leads to conflict. But I vitally need this two plugins to work together. I would rename $.mask
in one of them to... let's say, $.msk
, but in this case I'll always need to remember it and if I want to upgrade to new version, I will rename again.
Looking for better solution on how to cope with this kind of conflicts between jquery plugins.
If we are using two different frameworks with the same shortcut $ then one of them stops working due to conflict so to avoid the conflict between the two frameworks. we use $. noConflict() method.
Thus, if you are using another JavaScript library that uses the $ variable, you can run into conflicts with jQuery. In order to avoid these conflicts, you need to put jQuery in no-conflict mode immediately after it is loaded onto the page and before you attempt to use jQuery in your page.
on if not a function" jQuery error occurs for 2 main reasons: Loading an old version of the jQuery library that doesn't support the on function. Loading a library that overrides the value of the dollar sign $ variable.
I think you have a choice between solutions that require you to remember something, the question is how often do you want to remember.
If you rename one of them then you have to remember to patch any upgrades. I don't think this is such a big deal, it happens all the time in software development.
An alternative is to pull in one of the plugins and then immediately load a namespace patcher that simply does, for example, jQuery.fn.masked_input = jQuery.fn.mask;
and then the expose plugin can be loaded after that. This approach will work as long as the renamed plugin doesn't reference its own name anywhere. And, you'd have to remember the specific loading order for your plugins. This sort of thing also occurs all the time in software development.
I think I agree with mu's answer. One addition might be to use jQuery.sub().
Since most plugins use the jQuery global during construction, you should be able to alias jQuery before loading one of the plugins. Then you could re-alias afterwards to whatever you choose.
<script src="http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js?foo"></script>
<script type="text/javascript">
var jQuery = $.sub();
</script>
<script src="jquery.maskedinput.js" type="text/javascript"></script>
<script type="text/javascript">
var $$$ = jQuery;
jQuery = $;
</script>
The only possible advantage to this approach is that it might isolate one plugin from the changes that another plugin might make to jQuery methods. It's slightly convoluted but the only alternative to altering the plugins, that I can think of.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With