Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<html>
  <head>
    <meta name="description" content="Funções de Campos (Demonstração)">
  </head>
  <body>
    <table>
      <tr>
        <th colspan="2">
          Campos
        </th>
      </tr>
      <tr>
        <td>
          Campo Data:
        </td>
        <td>
          <input type="data" value="" size="20">
        </td>
      </tr>
      <tr>
        <td>
          Campo Número:
        </td>
        <td>
          <input type="numero" negativo="true" value="">
        </td>
      </tr>
      <tr>
        <td>
          Campo Telefone:
        </td>
        <td>
          <input type="telefone" value="">
        </td>
      </tr>
      <tr>
        <td>
          Campo CNPJ:
        </td>
        <td>
          <input type="cnpj" value="">
        </td>
      </tr>
      <tr>
        <td>
          Campo CPF:
        </td>
        <td>
          <input type="cpf" value="">
        </td>
      </tr>
      <tr>
        <td>
          Campo Moeda:
        </td>
        <td>
          <input type="moeda" value="0,00">
        </td>
      </tr>
    </table>
  </body>
</html>
​
 
// Funções de Inputs Especiais //
Object.prototype.setEvents = function () {
  var keyCodesP = [48, 49, 50, 51, 52, 53, 54, 55, 56, 57],
      keyCodesE = [9, 35, 36, 37, 39, 45],
      inputType = this.getAttribute("type"),
      onBlur = this.onblur,
      cursor, i;
​
  this.data = function () {
    var maxlength = 8;
​
    function format(value) {
      var newValue = "";
​
      for (i = 0; i < value.length; i++) {
        if (newValue.length == 2 || newValue.length == 5) {
          if (newValue.length <= cursor) {
            cursor += 1;
          }
​
          newValue += "/";
        }
​
        newValue += value.charAt(i);
      }
​
      return newValue;
    }
​
    this.setAttribute("placeholder", "DD/MM/AAAA");
​
    if (!this.getAttribute("size")) {
      this.size = 11;
    }
​
    this.onkeydown = function (event) {
      var keyCode = window.Event ? event.which : event.keyCode,
          value = this.value,
          selectionStart = this.selectionStart;
​
      if (event.ctrlKey === true) {
        return true;
      }
​
      cursor = selectionStart - (value.substr(0, selectionStart).length - value.substr(0, selectionStart).toString().replace(/[^\d]+/g, "").length);
      value = value.toString().replace(/[^\d]+/g, "");
      keyCode = keyCode >= 96 && keyCode <= 105 ? keyCode - 48 : keyCode;
​
      if (keyCode == 8 || keyCode == 46) {
        cursor -= keyCode == 8 ? 1 : 0;
        value = value.substr(0, cursor) + value.substr(cursor + 1);
​
        this.value = format(value);
        this.selectionStart = cursor;
        this.selectionEnd = cursor;
​
        return false;
      }
​
      if (inArray(keyCode, keyCodesE)) {
        return true;
      }
​
      if (value.length < maxlength && inArray(keyCode, keyCodesP)) {
        value = value.substr(0, cursor) + String.fromCharCode(keyCode) + value.substr(cursor, value.length);
        cursor += 1;
​
        this.value = format(value);
        this.selectionStart = cursor;
        this.selectionEnd = cursor;
​
        return false;
      }
​
      return false;
    };
​
    this.onpaste = function (event) {
      var clipboardData = window.clipboardData ? window.clipboardData.getData("text") : event.clipboardData.getData("text/plain"),
          value = this.value,
          selectionStart = this.selectionStart;
​
      clipboardData = clipboardData.toString().replace(/[^\d]+/g, "");
      cursor = selectionStart - (value.substr(0, selectionStart).length - value.substr(0, selectionStart).toString().replace(/[^\d]+/g, "").length);
      cursor += clipboardData.length;
​
      value = value.toString().replace(/[^\d]+/g, "");
      value = value.substr(0, cursor) + clipboardData + value.substr(cursor, value.length);
​
      if (value.length > maxlength) {
        value = value.substr(0, maxlength);
      }
​
      this.value = format(value);
      this.selectionStart = cursor;
      this.selectionEnd = cursor;
​
      return false;
    };
​
    this.onblur = function () {
      var value = this.value;
​
      if (value) {
        if (value.length == 10) {
          var dd = value.substr(0, 2),
              mm = value.substr(3, 2),
              yy = value.substr(6, 4);
​
          switch (mm) {
            case "01":
            case "03":
            case "05":
            case "07":
            case "08":
            case "10":
            case "12":
              if (dd >= 1 && dd <= 31) {
                return onBlur ? onBlur.call(this) : true;
              }
              break;
            case "04":
            case "06":
            case "09":
            case "11":
              if (dd >= 1 && dd <= 30) {
                return onBlur ? onBlur.call(this) : true;
              }
              break;
            case "02":
              if (dd >= 1 && (dd <= 28 || dd <= 29 && (!(yy % 4) && yy % 100 || !(yy % 400)))) {
                return onBlur ? onBlur.call(this) : true;
              }
              break;
          }
        }
​
        alert("A data \"" + value + "\" é inválida.");
        this.value = "";
        setTimeout(function () {
          this.focus();
        }, 0);
​
        return false;
      }
​
      if (onBlur) {
        onBlur.call(this);
      }
    };
  };
​
  this.numero = function () {
    var maxlength = this.getAttribute("maxlength");
​
    maxlength = maxlength ? maxlength : 999;
​
    this.onkeydown = function (event) {
      var keyCode = window.Event ? event.which : event.keyCode,
          value = this.value,
          selectionStart = this.selectionStart;
​
      if (event.ctrlKey === true) {
        return true;
      }
​
      cursor = selectionStart - (value.substr(0, selectionStart).length - value.substr(0, selectionStart).toString().replace(/[^\d]+/g, "").length);
      value = value.toString().replace(/[^\d]+/g, "");
      keyCode = keyCode >= 96 && keyCode <= 105 ? keyCode - 48 : keyCode;
​
      if (keyCode == 8 || keyCode == 46) {
        cursor -= keyCode == 8 ? 1 : 0;
        value = value.substr(0, cursor) + value.substr(cursor + 1);
​
        this.value = value;
        this.selectionStart = cursor;
        this.selectionEnd = cursor;
​
        return false;
      }
​
      if (inArray(keyCode, keyCodesE)) {
        return true;
      }
​
      if (value.length < maxlength && inArray(keyCode, keyCodesP)) {
        value = value.substr(0, cursor) + String.fromCharCode(keyCode) + value.substr(cursor, value.length);
        cursor += 1;
​
        this.value = value;
        this.selectionStart = cursor;
        this.selectionEnd = cursor;
​
        return false;
      }
​
      return false;
    };
​
    this.onpaste = function (event) {
      var clipboardData = window.clipboardData ? window.clipboardData.getData("text") : event.clipboardData.getData("text/plain"),
          value = this.value,
          selectionStart = this.selectionStart;
​
      clipboardData = clipboardData.toString().replace(/[^\d]+/g, "");
      cursor = selectionStart - (value.substr(0, selectionStart).length - value.substr(0, selectionStart).toString().replace(/[^\d]+/g, "").length);
      cursor += clipboardData.length;
​
      value = value.toString().replace(/[^\d]+/g, "");
      value = value.substr(0, cursor) + clipboardData + value.substr(cursor, value.length);
​
      if (value.length > maxlength) {
        value = value.substr(0, maxlength);
      }
​
      this.value = value;
      this.selectionStart = cursor;
      this.selectionEnd = cursor;
​
      return false;
    };
​
    this.onblur = function () {
      var value = this.value;
​
      for (i = 0; i < value.length; i++) {
        if (!inArray(value.charCodeAt(i), keyCodesP)) {
          alert("O número \"" + value + "\" é inválido.");
          this.value = "";
          setTimeout(function () {
            this.focus();
          }, 0);
​
          return false;
        }
      }
​
      if (onBlur) {
        onBlur.call(this);
      }
    };
  };
​
  this.telefone = function () {
    var maxlength = 11;
​
    function format(value) {
      var newValue = "";
​
      for (i = 0; i < value.length; i++) {
        if (newValue.length === 0) {
          if (newValue.length <= cursor) {
            cursor += 1;
          }
​
          newValue += "(";
        } else if (newValue.length == 3) {
          if (newValue.length <= cursor) {
            cursor += 2;
          }
​
          newValue += ") ";
        } else if ((value.length < 11 && newValue.length == 9) || (value.length == 11 && newValue.length == 10)) {
          if (newValue.length <= cursor) {
            cursor += 1;
          }
​
          newValue += "-";
        }
​
        newValue += value.charAt(i);
      }
​
      return newValue;
    }
​
    this.setAttribute("placeholder", "(XX) XXXX-XXXX");
​
    this.onkeydown = function (event) {
      var keyCode = window.Event ? event.which : event.keyCode,
          value = this.value,
          selectionStart = this.selectionStart;
​
      if (event.ctrlKey === true) {
        return true;
      }
​
      cursor = selectionStart - (value.substr(0, selectionStart).length - value.substr(0, selectionStart).toString().replace(/[^\d]+/g, "").length);
      value = value.toString().replace(/[^\d]+/g, "");
      keyCode = keyCode >= 96 && keyCode <= 105 ? keyCode - 48 : keyCode;
​
      if (keyCode == 8 || keyCode == 46) {
        cursor -= keyCode == 8 ? 1 : 0;
        value = value.substr(0, cursor) + value.substr(cursor + 1);
​
        this.value = format(value);
        this.selectionStart = cursor;
        this.selectionEnd = cursor;
​
        return false;
      }
​
      if (inArray(keyCode, keyCodesE)) {
        return true;
      }
​
      if (value.length < maxlength && inArray(keyCode, keyCodesP)) {
        value = value.substr(0, cursor) + String.fromCharCode(keyCode) + value.substr(cursor, value.length);
        cursor += 1;
​
        this.value = format(value);
        this.selectionStart = cursor;
        this.selectionEnd = cursor;
​
        return false;
      }
​
      return false;
    };
​
    this.onpaste = function (event) {
      var clipboardData = window.clipboardData ? window.clipboardData.getData("text") : event.clipboardData.getData("text/plain"),
          value = this.value,
          selectionStart = this.selectionStart;
​
      clipboardData = clipboardData.toString().replace(/[^\d]+/g, "");
      cursor = selectionStart - (value.substr(0, selectionStart).length - value.substr(0, selectionStart).toString().replace(/[^\d]+/g, "").length);
      cursor += clipboardData.length;
​
      value = value.toString().replace(/[^\d]+/g, "");
      value = value.substr(0, cursor) + clipboardData + value.substr(cursor, value.length);
​
      if (value.length > maxlength) {
        value = value.substr(0, maxlength);
      }
​
      this.value = format(value);
      this.selectionStart = cursor;
      this.selectionEnd = cursor;
​
      return false;
    };
​
    this.onblur = function () {
      var value = this.value;
​
      if (value && value.length != 14 && value.length != 15) {
        alert("O número \"" + value + "\" é inválido.");
        this.value = "";
        setTimeout(function () {
          this.focus();
        }, 0);
​
        return false;
      }
​
      if (onBlur) {
        onBlur.call(this);
      }
    };
  };
​
  this.cnpj = function () {
    var maxlength = 14;
​
    String.prototype.isCNPJ = function () {
      var value = this.toString().replace(/[^\d]+/g, ""),
          base = [6, 5, 4, 3, 2, 9, 8, 7, 6, 5, 4, 3, 2],
          n;
​
      if (value.length != 14) {
        return false;
      }
​
      if (value == "00000000000" || value == "11111111111" || value == "22222222222" || value == "33333333333" || value == "44444444444" || value == "55555555555" || value == "66666666666" || value == "77777777777" || value == "88888888888" || value == "99999999999") {
        return false;
      }
​
      for (i = 0, n = 0; i < 12;) {
        n += value[i] * base[++i];
      }
​
      if (value[12] != (((n %= 11) < 2) ? 0 : 11 - n)) {
        return false;
      }
​
      for (i = 0, n = 0; i <= 12;) {
        n += value[i] * base[i++];
      }
​
      if (value[13] != (((n %= 11) < 2) ? 0 : 11 - n)) {
        return false;
      }
​
      return true;
    };
​
    function format(value) {
      var newValue = "";
​
      for (i = 0; i < value.length; i++) {
        if (newValue.length == 2 || newValue.length == 6) {
          if (newValue.length <= cursor) {
            cursor += 1;
          }
​
          newValue += ".";
        } else if (newValue.length == 10) {
          if (newValue.length <= cursor) {
            cursor += 1;
          }
​
          newValue += "/";
        } else if (newValue.length == 15) {
          if (newValue.length <= cursor) {
            cursor += 1;
          }
​
          newValue += "-";
        }
​
        newValue += value.charAt(i);
      }
​
      return newValue;
    }
​
    this.setAttribute("placeholder", "XX.XXX.XXX/XXXX-XX");
​
    this.onkeydown = function (event) {
      var keyCode = window.Event ? event.which : event.keyCode,
          value = this.value,
          selectionStart = this.selectionStart;
​
      if (event.ctrlKey === true) {
        return true;
      }
​
      cursor = selectionStart - (value.substr(0, selectionStart).length - value.substr(0, selectionStart).toString().replace(/[^\d]+/g, "").length);
      value = value.toString().replace(/[^\d]+/g, "");
      keyCode = keyCode >= 96 && keyCode <= 105 ? keyCode - 48 : keyCode;
​
      if (keyCode == 8 || keyCode == 46) {
        cursor -= keyCode == 8 ? 1 : 0;
        value = value.substr(0, cursor) + value.substr(cursor + 1);
​
        this.value = format(value);
        this.selectionStart = cursor;
        this.selectionEnd = cursor;
​
        return false;
      }
​
      if (inArray(keyCode, keyCodesE)) {
        return true;
      }
​
      if (value.length < maxlength && inArray(keyCode, keyCodesP)) {
        value = value.substr(0, cursor) + String.fromCharCode(keyCode) + value.substr(cursor, value.length);
        cursor += 1;
​
        this.value = format(value);
        this.selectionStart = cursor;
        this.selectionEnd = cursor;
​
        return false;
      }
​
      return false;
    };
​
    this.onpaste = function (event) {
      var clipboardData = window.clipboardData ? window.clipboardData.getData("text") : event.clipboardData.getData("text/plain"),
          value = this.value,
          selectionStart = this.selectionStart;
​
      clipboardData = clipboardData.toString().replace(/[^\d]+/g, "");
      cursor = selectionStart - (value.substr(0, selectionStart).length - value.substr(0, selectionStart).toString().replace(/[^\d]+/g, "").length);
      cursor += clipboardData.length;
​
      value = value.toString().replace(/[^\d]+/g, "");
      value = value.substr(0, cursor) + clipboardData + value.substr(cursor, value.length);
​
      if (value.length > maxlength) {
        value = value.substr(0, maxlength);
      }
​
      this.value = format(value);
      this.selectionStart = cursor;
      this.selectionEnd = cursor;
​
      return false;
    };
​
    this.onblur = function () {
      var value = this.value;
​
      if (value && !value.isCNPJ()) {
        alert("O número do CNPJ inserido é inválido");
        this.value = "";
        setTimeout(function () {
          this.focus();
        }, 0);
​
        return false;
      }
​
      if (onBlur) {
        onBlur.call(this);
      }
    };
  };
​
  this.cpf = function () {
    var maxlength = 11;
​
    String.prototype.isCPF = function () {
      var value = this.toString().replace(/[^\d]+/g, ""),
          n;
​
      if (value.length != 11) {
        return false;
      }
​
      if (value == "00000000000" || value == "11111111111" || value == "22222222222" || value == "33333333333" || value == "44444444444" || value == "55555555555" || value == "66666666666" || value == "77777777777" || value == "88888888888" || value == "99999999999") {
        return false;
      }
​
      for (i = 0, n = 0; i < 9; i++) {
        n += value[i] * (10 - i);
      }
​
      if ((value[9] != ((11 - n % 11) < 10 ? (11 - n % 11) : 0))) {
        return false;
      }
​
      for (i = 0, n = 0; i < 10; i++) {
        n += value[i] * (11 - i);
      }
​
      if ((value[10] != ((11 - n % 11) < 10 ? (11 - n % 11) : 0))) {
        return false;
      }
​
      return true;
    };
​
    function format(value) {
      var newValue = "";
​
      for (i = 0; i < value.length; i++) {
        if (newValue.length == 3 || newValue.length == 7) {
          if (newValue.length <= cursor) {
            cursor += 1;
          }
​
          newValue += ".";
        } else if (newValue.length == 11) {
          if (newValue.length <= cursor) {
            cursor += 1;
          }
​
          newValue += "-";
        }
​
        newValue += value.charAt(i);
      }
​
      return newValue;
    }
​
    this.setAttribute("placeholder", "XXX.XXX.XXX-XX");
​
    this.onkeydown = function (event) {
      var keyCode = window.Event ? event.which : event.keyCode,
          value = this.value,
          selectionStart = this.selectionStart;
​
      if (event.ctrlKey === true) {
        return true;
      }
​
      cursor = selectionStart - (value.substr(0, selectionStart).length - value.substr(0, selectionStart).toString().replace(/[^\d]+/g, "").length);
      value = value.toString().replace(/[^\d]+/g, "");
      keyCode = keyCode >= 96 && keyCode <= 105 ? keyCode - 48 : keyCode;
​
      if (keyCode == 8 || keyCode == 46) {
        cursor -= keyCode == 8 ? 1 : 0;
        value = value.substr(0, cursor) + value.substr(cursor + 1);
​
        this.value = format(value);
        this.selectionStart = cursor;
        this.selectionEnd = cursor;
​
        return false;
      }
​
      if (inArray(keyCode, keyCodesE)) {
        return true;
      }
​
      if (value.length < maxlength && inArray(keyCode, keyCodesP)) {
        value = value.substr(0, cursor) + String.fromCharCode(keyCode) + value.substr(cursor, value.length);
        cursor += 1;
​
        this.value = format(value);
        this.selectionStart = cursor;
        this.selectionEnd = cursor;
​
        return false;
      }
​
      return false;
    };
​
    this.onpaste = function (event) {
      var clipboardData = window.clipboardData ? window.clipboardData.getData("text") : event.clipboardData.getData("text/plain"),
          value = this.value,
          selectionStart = this.selectionStart;
​
      clipboardData = clipboardData.toString().replace(/[^\d]+/g, "");
      cursor = selectionStart - (value.substr(0, selectionStart).length - value.substr(0, selectionStart).toString().replace(/[^\d]+/g, "").length);
      cursor += clipboardData.length;
​
      value = value.toString().replace(/[^\d]+/g, "");
      value = value.substr(0, cursor) + clipboardData + value.substr(cursor, value.length);
​
      if (value.length > maxlength) {
        value = value.substr(0, maxlength);
      }
​
      this.value = format(value);
      this.selectionStart = cursor;
      this.selectionEnd = cursor;
​
      return false;
    };
​
    this.onblur = function () {
      var value = this.value;
​
      if (value && !value.isCPF()) {
        alert("O número do CPF inserido é inválido");
        this.value = "";
        setTimeout(function () {
          this.focus();
        }, 0);
​
        return false;
      }
​
      if (onBlur) {
        onBlur.call(this);
      }
    };
  };
​
  this.moeda = function () {
    var maxlength = this.getAttribute("maxlength"),
        casas = this.getAttribute("casas"),
        inteiro, decimal;
​
    casas = casas >= 2 ? parseInt(casas, 10) : 2;
    maxlength = maxlength ? maxlength : 20 + casas;
​
    String.prototype.stripLeftZeros = function () {
      for (i = 0; i < this.length; i++) {
        if (this[i] != "0") {
          return this.substring(i);
        }
      }
​
      return "";
    };
​
    this.onkeydown = function (event) {
      var keyCode = window.Event ? event.which : event.keyCode,
          value = this.value.toString().replace(/[^\d]+/g, "").stripLeftZeros(),
          newValue = "";
​
      keyCode = keyCode >= 96 && keyCode <= 105 ? keyCode - 48 : keyCode;
​
      if (keyCode == 8) {
        while (value.length < casas + 2) {
          value = "0" + value;
        }
​
        inteiro = value.substr(0, value.length - (casas + 1));
        decimal = value.substr(value.length - (casas + 1), casas + 1);
​
        for (i = inteiro.length - 1, j = 0; i >= 0; i--, j++) {
          if (j % 3 === 0 && j !== 0) {
            newValue = "." + newValue;
          }
​
          newValue = inteiro[i] + newValue;
        }
​
        this.value = newValue + "," + decimal;
​
        return true;
      }
​
      if (inArray(keyCode, keyCodesE)) {
        return true;
      }
​
      if (inArray(keyCode, keyCodesP) && this.value.length < maxlength) {
        while (value.length < casas) {
          value = "0" + value;
        }
​
        inteiro = value.substr(0, value.length - (casas - 1));
        decimal = value.substr(value.length - (casas - 1), casas - 1);
​
        for (i = inteiro.length - 1, j = 0; i >= 0; i--, j++) {
          if (j % 3 === 0 && j !== 0) {
            newValue = "." + newValue;
          }
​
          newValue = inteiro[i] + newValue;
        }
​
        this.value = newValue + "," + decimal;
​
        return true;
      }
​
      return false;
    };
  };
​
  this[inputType]();
};
​
window.addEventListener("load", function () {
  var selectors = ["input[type=data]",
                   "input[type=numero]",
                   "input[type=telefone]",
                   "input[type=cnpj]",
                   "input[type=cpf]",
                   "input[type=moeda]"];
​
  (function () {
    var i;
​
    for (i = 0; i < this.length; i++) {
      this[i].setEvents();
    }
  }).call(document.querySelectorAll(selectors));
}, false);
// Fim das Funções de Inputs Especiais //
​
// ====================================================================== //
​
function inArray(value, array) {
  var i;
​
  for (i = 0; i < array.length; i++) {
    if (value == array[i]) {
      return true;
    }
  }
​
  return false;
} // Fim da função inArray
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
JulioPraderapro
0viewers