javascript - 错误: summernote is not a function when using local files

标签 javascript php html summernote

我遇到了一个非常奇怪的问题。当我使用本地的 Summernote 文件加载文本编辑器时,发生了“.summernote 不是函数”的情况。但是,如果我使用 cdn 文件加载编辑器,一切都会顺利。这是我的 HTML header 代码:

<!DOCTYPE html>
<html dir="ltr" lang="en">
<head>
    <meta charset="UTF-8"/>
    <title><?php echo $title; ?></title>
    <base href="<?php echo $base; ?>"/>
    <?php if ($description) { ?>
        <meta name="description" content="<?php echo $description; ?>"/>
    <?php } ?>
    <?php if ($keywords) { ?>
        <meta name="keywords" content="<?php echo $keywords; ?>"/>
    <?php } ?>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"/>
    <link href="favicon.ico" rel="icon">
    <!-- include jquery -->
    <script type="text/javascript" src="javascript/jquery/jquery-2.1.1.min.js"></script>
    <!-- include libraries BS3 -->
    <script type="text/javascript" src="javascript/bootstrap/js/bootstrap.min.js"></script>
    <link href="stylesheet/bootstrap.css" type="text/css" rel="stylesheet"/>
    <!-- include font-awesome-->
    <link href="javascript/font-awesome/css/font-awesome.min.css" type="text/css" rel="stylesheet"/>
    <!-- include datetimepicker-->
    <script src="javascript/jquery/datetimepicker/moment.js" type="text/javascript"></script>
    <script src="javascript/jquery/datetimepicker/bootstrap-datetimepicker.min.js" type="text/javascript"></script>
    <link href="javascript/jquery/datetimepicker/bootstrap-datetimepicker.min.css" type="text/css" rel="stylesheet" media="screen"/>
    <!-- include customer stylesheet-->
    <link type="text/css" href="stylesheet/stylesheet.css" rel="stylesheet" media="screen"/>
    <!--include customer js-->
    <script src="javascript/common.js" type="text/javascript"></script>

    <?php if ($styles) { ;?>
        <?php foreach ($styles as $style) { ;?>
            <link href="<?php echo $style;?>" rel="stylesheet"></link>
        <?php } ;?>
    <?php } ;?>
    <?php if ($scripts) { ;?>
        <?php foreach ($scripts as $script) { ;?>
            <script href="<?php echo $script;?>" type="text/javascript"></script>
        <?php } ;?>
    <?php } ;?>

<!--    <link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.2/summernote.css" rel="stylesheet">-->
<!--    <script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.2/summernote.js"></script>-->

我尝试直接加载本地文件,而不是通过PHP echo它们,但问题仍然存在。

我检查了每个href,没有死链接。

然后我在 javascript 文件夹下创建了一个名为 test.html 的纯 HTML 文件,并且文本编辑器使用本地文件加载良好。

顺便说一句,我使用的框架是CI,文件结构是:

root
├──javascript
   ├──bootstrap
   ├──jquery
   ├──summernote
   ├──font-awesome
   ├──test.html

最佳答案

我认为您没有按正确的顺序包含脚本。

当您从 CDN 加载时,您的订单如下所示:

<script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.2/summernote.js"></script>
<script src="javascript/common.js" type="text/javascript"></script>

。 。 。这是合乎逻辑的,因为您希望确保在执行主 JS 代码时加载 summernote

但是,您的 PHP 依赖项管理代码在同一脚本之后注入(inject)了链接到本地​​文件的标签。基本上,也将所有逻辑转储到客户的脚本之前:

<?php if ($styles) { ;?>
    <?php foreach ($styles as $style) { ;?>
        <link href="<?php echo $style;?>" rel="stylesheet"></link>
    <?php } ;?>
<?php } ;?>
<?php if ($scripts) { ;?>
    <?php foreach ($scripts as $script) { ;?>
        <script src="<?php echo $script;?>" type="text/javascript"></script>
    <?php } ;?>
<?php } ;?>

<script src="javascript/common.js" type="text/javascript"></script>

(另请注意,在 PHP 中,您为生成脚本标记编写了 href 而不是 src。)

关于javascript - 错误: summernote is not a function when using local files,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41096704/

相关文章:

javascript - bootstrap 下拉菜单只有一半的时间有效

php - 在 PHP 中发布数组

javascript - 获取模拟 : GLOBAL is not defined

javascript - ANTLR 3 中针对 Javascript 的表达式解析器

php - 将 rel ="lightbox"应用于包括图像在内的所有 href,但当链接是 url 链接时不要应用它!怎么做这个?

javascript - 自动完成 contentEditable div 中的文本

javascript - 将 CSS 与 React/JSX 结合使用

javascript - 由之前的 onclick 处理程序执行的 VueJS keyup 处理程序

javascript - 如何让我的选项卡 100% 位于顶部?

php - 警告 : preg_match() [function. 预匹配]:未知修饰符 'v'