3

我尝试使用mask电话号码和datetimepicker日期字段。但是我在一起使用它们时遇到了问题。

我尝试更改 的源jquery.js，即使它是同一文件的副本，当我将其放在不同的位置时也会datetimepicker停止工作，然后mask再次开始工作。

<?php
  setlocale(LC_ALL, "pt_BR");
  header('Content-type: text/html; charset=iso-8859-1');
?>
<html>
<head>
<script src="js/jquery/jquery-1.6.4.min.js"></script>
<script src="js/jquery/jquery.maskedinput.js"></script>
<link href="./bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="./css/bootstrap-datetimepicker.min.css" rel="stylesheet">
<!-- O problema esta nesta linha abaiso, com ela carregando funciona a data   mas não funciona a mascara do telefone -->
<!-- My problem is in the next line, if I remove it .mask fom jQuery works fine, but I lost datapicker -->
<script type="text/javascript" src="scripts/lib/jquery.js"></script>
<!-- In oposite, if I leave this line datatimepicker works as well but, .mask stop to work -->
<!-- se eu comentar a linha ocorre o contrario, funciona a mascar mas a data não abre a janela para selecionar o dia -->
</head>



<form method='POST' id='teste' name='teste' action='teste.php'>
Telefone:<input type='text' class='telefone' name='fone'><BR><BR>
Data Nascimento:
<div class='controls input-append date form_date' data-date='' data-date- format='dd/mm/yyyy' data-link-field='dtp_input1' data-link-format='yyyy-mm-dd'>
  <input size='16' type='text' value='22/11/2016' id='data_nascimento' name='data_nascimento' readonly >
  <span class='add-on'><i class='icon-remove'></i></span>
  <span class='add-on'><i class='icon-th'></i></span>
</div>
</form>
<script type="text/javascript" src="./bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="./js/bootstrap-datetimepicker.js" charset="UTF-8"></script>
<script type="text/javascript" src="./js/locales/bootstrap-datetimepicker.pt-BR.js" charset="UTF-8"></script>
<script type="text/javascript">
   $('.form_date').datetimepicker({
    language:  'pt-BR',
    weekStart: 1,
    todayBtn:  1,
    autoclose: 1,
    todayHighlight: 1,
    startView: 2,
    minView: 2,
    forceParse: 0
});
</script>
<script type="text/javascript">
   jQuery("input.telefone")
      .mask("(99) 9999-9999?9")
      .focusout(function (event) {
          var target, phone, element;
          target = (event.currentTarget) ? event.currentTarget :  event.srcElement;
          phone = target.value.replace(/\D/g, '');
          element = $(target);
          element.unmask();
          if(phone.length > 10) {
              element.mask("(99) 99999-999?9");
          } else {
              element.mask("(99) 9999-9999?9");
          }
      });
</script>
</html>
4

0 回答 0