Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
bom dia
tenho um script de multi select do jQuery/bootstrap, porém esta na versão 1.7.1 do jQuery as funções.
mas todo o resto do conteúdo esta com boostrap 3, com versão do jQuery 3.1.1.
Se eu desabilito a versão mais recente, ele funciona a função chosen. Se deixo rodando o chosen, o resto, inclusive o menu navbar não roda mais !!! :blink:
alguém sabe me dizer como resolvo isto?
pior que ja fiz isto. o <script> do chosen coloquei no head da pagina, e do boostrap no rodapé.
com o ctrl + shift + J aparece isto:
Uncaught TypeError: $(...).chosen is not a function
at HTMLDocument.<anonymous> (rec_adagenda22.php?dataprev=2017-01-19&cod=2323&ok=consultar:39)
at n (jquery-chosen.min.js:2)
at Object.fireWith (jquery-chosen.min.js:2)
at Function.ready (jquery-chosen.min.js:2)
at HTMLDocument.B (jquery-chosen.min.js:2)como ficou as tags script? poste elas.
você não deveria ter removido a tag do chosen.
esses fican no head:
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- define a viewport -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- adicionar CSS Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link href="css/estilo.css" rel="stylesheet" media="screen">
<link rel="stylesheet" href="css/bootstrap_chosen.css" />
<script src="js/jquery-chosen.min.js"></script>
<script src="js/chosen.jquery.js"></script>
<script>
$(function() {
$('.chosen-select').chosen();
$('.chosen-select-deselect').chosen({ allow_single_deselect: true });
});
</script>
e estes no rodapé da pagina:
<script src="js/jquery-3.1.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/js.js"></script>deveria ser assim:
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- define a viewport -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- adicionar CSS Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link href="css/estilo.css" rel="stylesheet" media="screen">
<link rel="stylesheet" href="css/bootstrap_chosen.css" />
<script src="js/jquery-3.1.1.min.js"></script>
<script src="js/jquery-chosen.min.js"></script>
<script>
$(function() {
$('.chosen-select').chosen();
$('.chosen-select-deselect').chosen({ allow_single_deselect: true });
});
</script>
e estes no rodapé da pagina:
<script src="js/bootstrap.min.js"></script>
<script src="js/js.js"></script>
entendeu? você estava importando o chosen 2 vezes, e colocando o jQuery no lugar errado.mas deste jeito, o menu dropdown do bootstrap nao funciona :huh:
certo, e o que aparece de erro no console? Ctrl + Shift + J?
Se tiver dúvidas, poste o link para o site.
é um link intranet:
segue o log:
bootstrap.min.js:6 Uncaught Error: Bootstrap's JavaScript requires jQuery version 1.9.1 or higher, but lower than version 4 at bootstrap.min.js:6 at bootstrap.min.js:6(anonymous) @ bootstrap.min.js:6(anonymous) @ bootstrap.min.js:6
alguem???
Use a função noConflict do jQuery e atribui uma das versões (ex: a menos utilizada no seu site) para uma variável com outro nome, aí você pode utilizar as duas versões sem problema...
// Inclui o jQuery mais antigo (no HTML)
// Chama a função noConflict para usar um outro nome para a variável (ao invés de usar $)
var jQueryOld = $.noConflict();
// inclui o jQuery mais atual (no HTML)
// Aí quando quiser usar o jQuery com versão mais antiga, você utiliza a variável que recebeu o noConflict ao invés de $
Deixa apenas a versão 1.7.1 antes de todas as tags script, para o jQuery ser a primeira.
depois disso, veja o console de erros o que aparece, ai resolvemos um por um.
Ctrl + Shift + J no Firefox ou Chrome.