inputmask.js 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361
  1. /* ===========================================================
  2. * Bootstrap: inputmask.js v3.1.0
  3. * http://jasny.github.io/bootstrap/javascript/#inputmask
  4. *
  5. * Based on Masked Input plugin by Josh Bush (digitalbush.com)
  6. * ===========================================================
  7. * Copyright 2012-2014 Arnold Daniels
  8. *
  9. * Licensed under the Apache License, Version 2.0 (the "License")
  10. * you may not use this file except in compliance with the License.
  11. * You may obtain a copy of the License at
  12. *
  13. * http://www.apache.org/licenses/LICENSE-2.0
  14. *
  15. * Unless required by applicable law or agreed to in writing, software
  16. * distributed under the License is distributed on an "AS IS" BASIS,
  17. * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  18. * See the License for the specific language governing permissions and
  19. * limitations under the License.
  20. * ========================================================== */
  21. +function ($) { "use strict";
  22. var isIphone = (window.orientation !== undefined)
  23. var isAndroid = navigator.userAgent.toLowerCase().indexOf("android") > -1
  24. var isIE = window.navigator.appName == 'Microsoft Internet Explorer'
  25. // INPUTMASK PUBLIC CLASS DEFINITION
  26. // =================================
  27. var Inputmask = function (element, options) {
  28. if (isAndroid) return // No support because caret positioning doesn't work on Android
  29. this.$element = $(element)
  30. this.options = $.extend({}, Inputmask.DEFAULTS, options)
  31. this.mask = String(this.options.mask)
  32. this.init()
  33. this.listen()
  34. this.checkVal() //Perform initial check for existing values
  35. }
  36. Inputmask.DEFAULTS = {
  37. mask: "",
  38. placeholder: "_",
  39. definitions: {
  40. '9': "[0-9]",
  41. 'a': "[A-Za-z]",
  42. 'w': "[A-Za-z0-9]",
  43. '*': "."
  44. }
  45. }
  46. Inputmask.prototype.init = function() {
  47. var defs = this.options.definitions
  48. var len = this.mask.length
  49. this.tests = []
  50. this.partialPosition = this.mask.length
  51. this.firstNonMaskPos = null
  52. $.each(this.mask.split(""), $.proxy(function(i, c) {
  53. if (c == '?') {
  54. len--
  55. this.partialPosition = i
  56. } else if (defs[c]) {
  57. this.tests.push(new RegExp(defs[c]))
  58. if (this.firstNonMaskPos === null)
  59. this.firstNonMaskPos = this.tests.length - 1
  60. } else {
  61. this.tests.push(null)
  62. }
  63. }, this))
  64. this.buffer = $.map(this.mask.split(""), $.proxy(function(c, i) {
  65. if (c != '?') return defs[c] ? this.options.placeholder : c
  66. }, this))
  67. this.focusText = this.$element.val()
  68. this.$element.data("rawMaskFn", $.proxy(function() {
  69. return $.map(this.buffer, function(c, i) {
  70. return this.tests[i] && c != this.options.placeholder ? c : null
  71. }).join('')
  72. }, this))
  73. }
  74. Inputmask.prototype.listen = function() {
  75. if (this.$element.attr("readonly")) return
  76. var pasteEventName = (isIE ? 'paste' : 'input') + ".mask"
  77. this.$element
  78. .on("unmask.bs.inputmask", $.proxy(this.unmask, this))
  79. .on("focus.bs.inputmask", $.proxy(this.focusEvent, this))
  80. .on("blur.bs.inputmask", $.proxy(this.blurEvent, this))
  81. .on("keydown.bs.inputmask", $.proxy(this.keydownEvent, this))
  82. .on("keypress.bs.inputmask", $.proxy(this.keypressEvent, this))
  83. .on(pasteEventName, $.proxy(this.pasteEvent, this))
  84. }
  85. //Helper Function for Caret positioning
  86. Inputmask.prototype.caret = function(begin, end) {
  87. if (this.$element.length === 0) return
  88. if (typeof begin == 'number') {
  89. end = (typeof end == 'number') ? end : begin
  90. return this.$element.each(function() {
  91. if (this.setSelectionRange) {
  92. this.setSelectionRange(begin, end)
  93. } else if (this.createTextRange) {
  94. var range = this.createTextRange()
  95. range.collapse(true)
  96. range.moveEnd('character', end)
  97. range.moveStart('character', begin)
  98. range.select()
  99. }
  100. })
  101. } else {
  102. if (this.$element[0].setSelectionRange) {
  103. begin = this.$element[0].selectionStart
  104. end = this.$element[0].selectionEnd
  105. } else if (document.selection && document.selection.createRange) {
  106. var range = document.selection.createRange()
  107. begin = 0 - range.duplicate().moveStart('character', -100000)
  108. end = begin + range.text.length
  109. }
  110. return {
  111. begin: begin,
  112. end: end
  113. }
  114. }
  115. }
  116. Inputmask.prototype.seekNext = function(pos) {
  117. var len = this.mask.length
  118. while (++pos <= len && !this.tests[pos]);
  119. return pos
  120. }
  121. Inputmask.prototype.seekPrev = function(pos) {
  122. while (--pos >= 0 && !this.tests[pos]);
  123. return pos
  124. }
  125. Inputmask.prototype.shiftL = function(begin,end) {
  126. var len = this.mask.length
  127. if (begin < 0) return
  128. for (var i = begin, j = this.seekNext(end); i < len; i++) {
  129. if (this.tests[i]) {
  130. if (j < len && this.tests[i].test(this.buffer[j])) {
  131. this.buffer[i] = this.buffer[j]
  132. this.buffer[j] = this.options.placeholder
  133. } else
  134. break
  135. j = this.seekNext(j)
  136. }
  137. }
  138. this.writeBuffer()
  139. this.caret(Math.max(this.firstNonMaskPos, begin))
  140. }
  141. Inputmask.prototype.shiftR = function(pos) {
  142. var len = this.mask.length
  143. for (var i = pos, c = this.options.placeholder; i < len; i++) {
  144. if (this.tests[i]) {
  145. var j = this.seekNext(i)
  146. var t = this.buffer[i]
  147. this.buffer[i] = c
  148. if (j < len && this.tests[j].test(t))
  149. c = t
  150. else
  151. break
  152. }
  153. }
  154. },
  155. Inputmask.prototype.unmask = function() {
  156. this.$element
  157. .unbind(".mask")
  158. .removeData("inputmask")
  159. }
  160. Inputmask.prototype.focusEvent = function() {
  161. this.focusText = this.$element.val()
  162. var len = this.mask.length
  163. var pos = this.checkVal()
  164. this.writeBuffer()
  165. var that = this
  166. var moveCaret = function() {
  167. if (pos == len)
  168. that.caret(0, pos)
  169. else
  170. that.caret(pos)
  171. }
  172. moveCaret()
  173. setTimeout(moveCaret, 50)
  174. }
  175. Inputmask.prototype.blurEvent = function() {
  176. this.checkVal()
  177. if (this.$element.val() !== this.focusText)
  178. this.$element.trigger('change')
  179. }
  180. Inputmask.prototype.keydownEvent = function(e) {
  181. var k = e.which
  182. //backspace, delete, and escape get special treatment
  183. if (k == 8 || k == 46 || (isIphone && k == 127)) {
  184. var pos = this.caret(),
  185. begin = pos.begin,
  186. end = pos.end
  187. if (end - begin === 0) {
  188. begin = k != 46 ? this.seekPrev(begin) : (end = this.seekNext(begin - 1))
  189. end = k == 46 ? this.seekNext(end) : end
  190. }
  191. this.clearBuffer(begin, end)
  192. this.shiftL(begin, end - 1)
  193. return false
  194. } else if (k == 27) {//escape
  195. this.$element.val(this.focusText)
  196. this.caret(0, this.checkVal())
  197. return false
  198. }
  199. }
  200. Inputmask.prototype.keypressEvent = function(e) {
  201. var len = this.mask.length
  202. var k = e.which,
  203. pos = this.caret()
  204. if (e.ctrlKey || e.altKey || e.metaKey || k < 32) {//Ignore
  205. return true
  206. } else if (k) {
  207. if (pos.end - pos.begin !== 0) {
  208. this.clearBuffer(pos.begin, pos.end)
  209. this.shiftL(pos.begin, pos.end - 1)
  210. }
  211. var p = this.seekNext(pos.begin - 1)
  212. if (p < len) {
  213. var c = String.fromCharCode(k)
  214. if (this.tests[p].test(c)) {
  215. this.shiftR(p)
  216. this.buffer[p] = c
  217. this.writeBuffer()
  218. var next = this.seekNext(p)
  219. this.caret(next)
  220. }
  221. }
  222. return false
  223. }
  224. }
  225. Inputmask.prototype.pasteEvent = function() {
  226. var that = this
  227. setTimeout(function() {
  228. that.caret(that.checkVal(true))
  229. }, 0)
  230. }
  231. Inputmask.prototype.clearBuffer = function(start, end) {
  232. var len = this.mask.length
  233. for (var i = start; i < end && i < len; i++) {
  234. if (this.tests[i])
  235. this.buffer[i] = this.options.placeholder
  236. }
  237. }
  238. Inputmask.prototype.writeBuffer = function() {
  239. return this.$element.val(this.buffer.join('')).val()
  240. }
  241. Inputmask.prototype.checkVal = function(allow) {
  242. var len = this.mask.length
  243. //try to place characters where they belong
  244. var test = this.$element.val()
  245. var lastMatch = -1
  246. for (var i = 0, pos = 0; i < len; i++) {
  247. if (this.tests[i]) {
  248. this.buffer[i] = this.options.placeholder
  249. while (pos++ < test.length) {
  250. var c = test.charAt(pos - 1)
  251. if (this.tests[i].test(c)) {
  252. this.buffer[i] = c
  253. lastMatch = i
  254. break
  255. }
  256. }
  257. if (pos > test.length)
  258. break
  259. } else if (this.buffer[i] == test.charAt(pos) && i != this.partialPosition) {
  260. pos++
  261. lastMatch = i
  262. }
  263. }
  264. if (!allow && lastMatch + 1 < this.partialPosition) {
  265. this.$element.val("")
  266. this.clearBuffer(0, len)
  267. } else if (allow || lastMatch + 1 >= this.partialPosition) {
  268. this.writeBuffer()
  269. if (!allow) this.$element.val(this.$element.val().substring(0, lastMatch + 1))
  270. }
  271. return (this.partialPosition ? i : this.firstNonMaskPos)
  272. }
  273. // INPUTMASK PLUGIN DEFINITION
  274. // ===========================
  275. var old = $.fn.inputmask
  276. $.fn.inputmask = function (options) {
  277. return this.each(function () {
  278. var $this = $(this)
  279. var data = $this.data('bs.inputmask')
  280. if (!data) $this.data('bs.inputmask', (data = new Inputmask(this, options)))
  281. })
  282. }
  283. $.fn.inputmask.Constructor = Inputmask
  284. // INPUTMASK NO CONFLICT
  285. // ====================
  286. $.fn.inputmask.noConflict = function () {
  287. $.fn.inputmask = old
  288. return this
  289. }
  290. // INPUTMASK DATA-API
  291. // ==================
  292. $(document).on('focus.bs.inputmask.data-api', '[data-mask]', function (e) {
  293. var $this = $(this)
  294. if ($this.data('bs.inputmask')) return
  295. $this.inputmask($this.data())
  296. })
  297. }(window.jQuery);