joomla bootstrap jquery проблема

У меня есть сайт, использующий joomla с бутстрапом. Когда я пытаюсь загрузить jquery с JHtml::_('jquery.framework'); в файл index.php из шаблона и использовать jquery в статье, он дает ошибку.joomla bootstrap jquery проблема

в JOOMLA статье:

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Evenementen</title> 
</head> 
<body> 
<div class="inleidingevenement"> 
<H2> INSCHRIJVEN VOOR DE EVENEMENTEN </H2> 
<p> Hieronder kun je je aanmelden voor de evenementen. Wanneer je status op "Aanwezig" staat, ben je aangemeld voor het desbetreffende evenement. </p> 
</div> 
<button id="button" class="btn"> </button> 

<script src="templates/templatename/js/status.js"> </script>

и status.js:

// JavaScript Document 
$(document).ready(function(){ 

$("#button").click(
    function() { 
     $("#button").addClass("btn-primary"); 
    } 
    ); 
});

это дает ошибку

Uncaught TypeError: undefined is not a function

линия это относится к тому, первая строка с кодом $(document.....

Когда я пробую это в другом файле, без joomla e.d. он отлично работает. Почему jquery не загружен, как ожидалось?

<head> 
<meta charset="UTF-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <base href="https://localhost/index.php/leden/evenementen" /> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
    <meta name="author" content="Super User" /> 
    <meta name="description" content="templatename" /> 
    <meta name="generator" content="Joomla! - Open Source Content Management" /> 
    <title>Evenementen</title> 
    <link href="https://localhost/index.php/leden/evenementen" rel="canonical" /> 
    <link href="/templates/templatename/favicon.ico" rel="shortcut icon" type="image/vnd.microsoft.icon" /> 
    <link rel="stylesheet" href="/media/jui/css/bootstrap.min.css" type="text/css" /> 
    <link rel="stylesheet" href="/media/jui/css/bootstrap-responsive.min.css" type="text/css" /> 
    <link rel="stylesheet" href="/media/jui/css/bootstrap-extended.css" type="text/css" /> 
    <link rel="stylesheet" href="/media/system/css/frontediting.css" type="text/css" /> 
    <script src="/media/jui/js/jquery.min.js" type="text/javascript"></script> 
    <script src="/media/jui/js/jquery-noconflict.js" type="text/javascript"></script> 
    <script src="/media/jui/js/jquery-migrate.min.js" type="text/javascript"></script> 
    <script src="/media/system/js/caption.js" type="text/javascript"></script> 
    <script src="/media/jui/js/bootstrap.min.js" type="text/javascript"></script> 
    <script src="/media/system/js/frontediting.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
jQuery(window).on('load', function() { 
      new JCaption('img.caption'); 
     }); 
jQuery(document).ready(function(){ 
jQuery('.hasTooltip').tooltip({"html": true,"container": "body"}); 
}); 
jQuery(document).ready(function() 
     { 
      jQuery('.hasPopover').popover({"html": true,"trigger": "hover focus","container": "body"}); 
     }); 
window.setInterval(function(){var r;try{r=window.XMLHttpRequest?new XMLHttpRequest():new  ActiveXObject("Microsoft.XMLHTTP")}catch(e){}if(r){r.open("GET","./",true);r.send(null)}},840000); 
    </script> 
    <!--[if lt IE 9]> 
    <script src="/media/jui/js/html5.js"></script> 
<![endif]--> 
<link href="/templates/templatename/css/custom.css" rel="stylesheet" type="text/css" > 
<script src="/templates/templatename/js/global.js"></script> 
</head>

источник

2014-10-23 Harm Jan Beekhuis

Атрибут доллара, вероятно, не зарезервирован для jQuery, поскольку он может использоваться MooTools. Попробуйте это:

jQuery(document).ready(function($) { ...

или стенографии:

jQuery(function($) { ...

Это создает объект JQuery и передает псевдоним доллара в качестве аргумента, так что доступно внутри.

Другая возможность заключается в том, что jQuery уже загружен (Bootstrap зависит от него), и вы удвоились. Это нарушает все. Проверьте источник страницы и убедитесь, что загружен только один экземпляр jQuery.

источник

2014-10-23 17:43:48 isherwood

Спасибо! Это сработало. –

Не совсем решение, но работает для меня в некоторой ситуации.

var interval = setInterval(function(){ 
if(typeof $!="undefined"){ //check whether jQuery is loaded or not 

    $("#button").click(
    function() { 
     $("#button").addClass("btn-primary"); 
    } 
    ); 
    clearInterval(interval); 
} 
},500)

Здесь я предполагаю, что jquery еще не загружен.

источник

2014-10-23 18:10:41 vusan

joomla bootstrap jquery проблема

ответ

Смежные вопросы