如何正确加载jQuery&进入Joomla

How do I properly load jQuery & Bootstrap into Joomla?

本文关键字：进入 Joomla amp 何正确 加载 jQuery      更新时间：2023-09-26

我正在构建一个在joomla后端使用jquery和bootstrap的表单，但我遇到了一个错误。

这是joomla代码：

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<?php
if (version_compare(PHP_VERSION, '5.3.10', '<'))
{
    die('Your host needs to use PHP 5.3.10 or higher to run this version of Joomla!');
}
define('_JEXEC', 1);
if (file_exists(__DIR__ . '/defines.php'))
{
    include_once __DIR__ . '/defines.php';
}

if (!defined('_JDEFINES'))
{
    define('JPATH_BASE', __DIR__);
    require_once JPATH_BASE . '/includes/defines.php';
}
require_once JPATH_BASE . '/includes/framework.php';

JDEBUG ? $_PROFILER->mark('afterLoad') : null;
$app = JFactory::getApplication('site');
$app->execute();
?>

以下是我想添加到joomla:的javascript代码

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="./send_resume/pmc_resume_js.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $(".carouselrow").html("");
    $(".messagerow").html("");
    $(".contentrow").html("<div class='row'><div class='col-lg-2'></div><div style='background-color:white' id='resume_forms' class='col-lg-9'></div><div class='col-lg-1'></div></div>");
    $("#resume_forms").load("./pmc_resume_forms.php","",""); 
    if($("#resume_forms").html()==""){
        $("#resume_forms").load(./pmc_resume_forms.php","",""); 
}
    $(".contentrow").css("background-color", "#F0F4F7"); 
    $(".breadcrumbs").html("<span class='showHere'>You are here: </span><span>Career</span></div>");
    $("title").html("Career");
});
</script>

当我没有在tmy代码的开头添加jquery库时，引导程序下拉导航栏就不起作用了。

当我将jquery文件添加到代码的开头，而不在javascript代码的开头添加jquery文件时，下拉导航栏工作正常，但我的javascript代码不工作。

当我在这两个地方添加jquery库文件时，我的javascript代码运行良好，但导航栏菜单不起作用。

我该如何解决这个问题？谢谢

来自Joomla文档：

引导：

要启用Bootstrap框架，请调用JHtml:：_（'bootstrap.framework'）。这将自动启用noConflict模式下的jQuery框架（即通过jQuery.访问美元）。包含的引导程序库版本为2.1.0，位于位于media/jui/bootstrap.js。它包括初始化Bootstrap粘贴、警报、按钮、转盘、折叠、下拉、模式、，工具提示、popover、scrollspy、tab和typeahead插件。

注意：引导按钮和jquery ui按钮。在同一页上同时使用这两种方法可能会导致冲突。有关可能的解决方法，请参见[1]。

jQuery:

为了加载jQuery，请使用JHtml:：_（'jQuery.framework'）；

这将在无冲突模式下加载jQuery 1.11.1版本的库。这意味着它是通过jQuery命名空间访问的，而不是通过$。

要在正常模式下加载它，请调用JHtml:：_（'jquery.framework'，false）；

如何加载JavaScript&CSS文件到Joomla：

Joomla加载Javascript和CSS文件的正确方式是JHtml::script('path-to-file');和JHtml::stylesheet('path-to-stylesheet');

文档页面：http://docs.joomla.org/Adding_JavaScript_and_CSS_to_the_page

加载脚本：

JHtml:：script下面是这个函数的签名，你可以请参阅api.joomla.org/上的JHtml:：script

脚本（字符串$file，布尔$framework=false，布尔$relative=false，boolean$path_only=false，boole$detect_browser=true，boolean$detect_debug=true）：混合

示例脚本：

<?php
JHtml::script(JUri::base() . 'templates/custom/js/sample.js', true);
?>

使用插件

加载jQuery的一个好的Joomla插件是jQuery Easy

相关文章：