0

Olá, tudo bem? Estou com um probleminha que já me consumiu muito tempo, estou tentando colocar uma mascara para hora em um campo input, o codigo já esta ok e funcionando o problema é quando eu importo a biblioteca do js dentro do head do meu header.php, porque buga o resto do meu site todo, tentei de algumas formas importar porém nada ate o momento resolve, tentei das seguintes maneiras:

var mask = function (val) {
    val = val.split(":");
    return (parseInt(val[0]) > 19)? "HZ:M0" : "H0:M0";
}

pattern = {
    onKeyPress: function(val, e, field, options) {
        field.mask(mask.apply({}, arguments), options);
    },
    translation: {
        'H': { pattern: /[0-2]/, optional: false },
        'Z': { pattern: /[0-3]/, optional: false },
        'M': { pattern: /[0-5]/, optional: false }
    },
    placeholder: 'hh:mm'
};

var $a = jQuery.noConflict()
$a(document).ready(function () {
  $a("#QuantidadeHoras").mask(mask, pattern);
});


 wp_deregister_script( 'jquery' );
    wp_register_script( 'jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js');
    wp_enqueue_script( 'jquery' );

     wp_deregister_script( 'jquery' );
    wp_register_script( 'jquery', 'https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.0/jquery.mask.min.js');
    wp_enqueue_script( 'jquery' );

1 Resposta 1

0

Só uma pergunta, por que você esta adicionando o JS no header.php? Tenta incluir ele no footer.php (se tiver)

Tenta fazer isso:

faz o seguinte, substitui isso: var $a = jQuery.noConflict() $a(document).ready(function () { $a("#QuantidadeHoras").mask(mask, pattern); }); por isso:

(function (document, $){ $('#QuantidadeHoras').mask(mask, pattern); }(document, jQuery)

OU :

jQuery(function(document).ready(){ $('#QuantidadeHoras').mask(mask, pattern); })

Se eu não respondi sua pergunta, peço desculpas.

4
  • Bom adicionei no header por costume mesmo, tentei inclui no footer porém o erro de bugar umas partes do site continua: adicionei dessa forma: <script src="ajax.googleapis.com/ajax/libs/jquery/2.1.1/…> <script src="cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.0/…>
    – Fernando
    10/10/2017 às 19:26
  • Incluindo no footer dessa forma nada acontece: wp_deregister_script( 'jquery' ); wp_register_script( 'jquery', 'ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'); wp_enqueue_script( 'jquery' ); wp_deregister_script( 'jquery' ); wp_register_script( 'jquery', 'cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.0/…); wp_enqueue_script( 'jquery' );
    – Fernando
    10/10/2017 às 19:30
  • então, pelo pouco conhecimento que tenho, inclusive em wordpress, o problema que da quando buga as outras partes é porque está dando conflito de jQuery, pode inspecionar o codigo fonte da página e ver que está carregando mais de uma versão. Eu achei uma função no stack gringo, veja se resolve: 11/10/2017 às 11:05
  • function starter_scripts() { wp_deregister_script( 'jquery' ); wp_register_script( 'jquery', includes_url( '/js/jquery/jquery.js' ), false, NULL, true ); wp_enqueue_script( 'jquery' ); wp_enqueue_style( 'starter-style', get_stylesheet_uri() ); wp_enqueue_script( 'includes', get_template_directory_uri() . '/js/min/includes.min.js', '', '', true ); } add_action( 'wp_enqueue_scripts', 'starter_scripts' ); 11/10/2017 às 11:05

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .