个人中心
gpt4 book ai didi

javascript - Summernote 所见即所得

转载 作者：太空宇宙 更新时间：2023-11-03 21:39:35 28 4
gpt4 key购买 nike

我无法初始化 summernote WYSIWYG editor在我的应用程序中，我不知道为什么不起作用。

我开始导入JS和CSS文件，打开一个id为“summernote”的div标签，在底部插入javascript代码。所有源文件都已正确指向。

我想渲染 hackerwins.github.io/summernote 中显示的文本编辑器.它不显示编辑器。只是 <div id="summernote"></div> 中的纯文本“使用元素” 

<!DOCTYPE html>
    <!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
    <!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
    <!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
    <!--[if gt IE 8]><!--> <html> <!--<![endif]-->
    <head>
    <meta charset="utf-8">

    <title>Dashboard</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
    <script src="//code.jquery.com/jquery-1.9.1.min.js"></script>   
    <link rel="stylesheet" href="http://localhost/projecto/assets/css/bootstrap.css">
    <link rel="stylesheet" href="http://localhost/projecto/assets/css/animations.css">
    <link rel="stylesheet" href="http://localhost/projecto/assets/css/main.css">
    <link rel="stylesheet" href="http://localhost/projecto/assets/css/extras.css">

    <script src="http://localhost/projecto/assets/js/vendor/modernizr-2.6.2.min.js"></script>


    <link href="http://localhost/projecto/assets/css/summernote.css" rel="stylesheet">
    <script src="http://localhost/projecto/assets/js/summernote.min.js"></script>



    </head>
    <body><div id="top"></div>
    <!--[if lt IE 7]>
    <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
    <![endif]-->



    <section id="topline">
    <div class="container">
    <div class="row">
    <div class="col-sm-6">
    <p>ana.coelho@anacoelhoarq.com |  <a href="http://localhost/projecto/index.php/admin/login/logout">Logout</a> </p>
    </div>

    </div>
    </div>        
    </section>


    <section id="header">
    <div class="container"><div class="row">

    <img class="navbar-brand" src="http://localhost/projecto/assets/img/logotipo.jpg" alt="logo">

    <div class="col-sm-12 mainmenu_wrap"><div class="main-menu-icon visible-xs"><span></span><span></span><span></span></div>
    <ul id="mainmenu" class="nav menu sf-menu responsive-menu superfish">
    <li class="active">
    <a href="./">Dashboard</a>
    </li>
    <li class="dropdown">
    <a href="./about.html">Projectos</a>
    <ul class="nav dropdown-menu">
    <li class="dropdown">
    <a href="./blog.html">Inserir</a>

    </li>
    <li class="dropdown">
    <a href="./blog.html">Consultar</a>

    </li>

    </ul>
    </li>
    <li class="dropdown">
    <a href="./blog.html">Publicações</a>
    <ul class="nav dropdown-menu">
    <li class="">
    <a href="./blog.html">Inserir</a>
    </li>
    <li class="">
    <a href="./blog.html">Consultar</a>
    </li>

    </ul>
    </li>
    <li class="dropdown">
    <a href="./blog.html">Newsletter</a>
    <ul class="nav dropdown-menu">
    <li class="">
    <a href="./blog.html">Consultar inscriçóes</a>
    </li>

    </ul>
    </li>

    </ul>
    </div>

    </div></div>
    </section><div class="container">

    <div class="row">


    <div id="summernote" class="summernote col-sm-12"><h4>use element</h4></div>

    </div>
    </div>
    <footer id="footer" style="padding: 0px;" class="darkgrey_section">
    <div class="container">
    <div class="row">


    <div class="col-sm-8">

    <p style="color: #AAA;">© 2014 - anacoelhoarq.com Todos os direitos reservados</p>

    </div>
    <div class="col-sm-4">



    </div>

    </div>
    </div>
    </footer>

    <script>$(document).ready(function() {
    $('.summernote').summernote();
    });</script>


    </body>
    </html>

最佳答案

检查 the documentation .您需要包括 jQuery , bootstrap和 fontawesome :

<script src="//code.jquery.com/jquery-1.9.1.min.js"></script> 
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.1/css/bootstrap.min.css"> 
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.1/js/bootstrap.min.js"></script> 
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">

你需要像这样初始化 Summernote:

$(document).ready(function() {
  $('#summernote').summernote();
});

关于javascript - Summernote 所见即所得，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24509266/

28 4 0
文章推荐： python - 如何使 Tkinter python 脚本每 X 秒获取一次变量？
文章推荐： c# - Entity Framework 代码优先 6.0 : is there any annotations to add index to a column(s)
文章推荐： python - pywin32 Windows 服务不想发送请求状态
文章推荐： c# - Switch 语句的使用和验证的最佳方式
太空宇宙
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com