Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/413.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
这个JavaScript解析代码有什么错?_Javascript_Jquery_Html - Fatal编程技术网

这个JavaScript解析代码有什么错?

这个JavaScript解析代码有什么错?,javascript,jquery,html,Javascript,Jquery,Html,我正在尝试为我的网站的一部分制作一个简单的HTML编辑器,没有Ace或TinyMCE之类的东西。问题是,当我使用本地存储时,“保存”功能似乎可以工作,但“查看”功能没有将注释更改为已保存的注释 我在为你们所有人做了一个JSFIDLE 以下是我的HTML代码: <html> <head> <!-- Begin Section 1: Metas --> <meta http-equiv="X-UA-Compatible" content="I

我正在尝试为我的网站的一部分制作一个简单的HTML编辑器,没有Ace或TinyMCE之类的东西。问题是,当我使用本地存储时,“保存”功能似乎可以工作,但“查看”功能没有将注释更改为已保存的注释

我在为你们所有人做了一个JSFIDLE

以下是我的HTML代码:

<html>
<head>
    <!-- Begin Section 1: Metas -->
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="UTF-8">
    <!-- End Section 1: Metas -->
    <!-- Begin Section 2: Scripts -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/nprogress/0.1.3/nprogress.min.js" type="text/javascript"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
    <script src="https://cdn.mxpnl.com/libs/mixpanel-2.2.min.js" type="text/javascript"></script>
    <script src="https://secure.quantserve.com/quant.js" type="text/javascript"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ladda-bootstrap/0.1.0/ladda.min.js" type="text/javascript"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ladda-bootstrap/0.1.0/spin.min.js" type="text/javascript"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.2/modernizr.min.js" type="text/javascript"></script>
    <script src="scripts/app/app.js" type="text/javascript"></script>
    <!-- End Section 2: Scripts -->
    <!-- Begin Section 3: Stylesheets and Links -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.1.1/animate.min.css" rel="stylesheet" type="text/css">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/nprogress/0.1.3/nprogress.min.css" rel="stylesheet" type="text/css">
    <link href="http://fonts.googleapis.com/css?family=Pacifico|Open+Sans|Roboto|Roboto+Slab" rel="stylesheet" type="text/css">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/ladda-bootstrap/0.1.0/ladda.min.css" rel="stylesheet" type="text/css">
    <link href="stylesheets/app/app.css" rel="stylesheet" type="text/css">
    <!-- End Section 3: Stylesheets and Links -->
    <!-- Start Section 4: Required Elements -->
    <title>Superpad Editor</title>
    <!-- End Section 4: Required Elements -->
</head>
<body>
    <div class="container animated bounce">
        <div class="errors"></div>
        <nav class="navbar navbar-default" role="navigation">
            <div class="container">
                <!-- Brand and toggle get grouped for better mobile display -->
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-brand-centered">
                            <span class="sr-only">Toggle navigation</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <div class="navbar-brand navbar-brand-centered"><span class="brand-logo">Superpad</span></div>
                    </div>
                    <!-- Collect the nav links, forms, and other content for toggling -->
                    <div class="collapse navbar-collapse" id="navbar-brand-centered">
                        <ul class="nav navbar-nav">
                        </ul>
                        <ul class="nav navbar-nav navbar-right">        
                        </ul>
                    </div><!-- /.navbar-collapse -->
            </div><!-- /.container-fluid -->
        </nav>
        <div class="btn-group">
            <button type="button" class="btn btn-primary" id="save">Save Notes</button>
            <button type="button" class="btn btn-success" id="view">View Saved Notes</button>
        </div>
        <div contenteditable class="content-editable normal editor"></div>
    </div>
</body>
</html>
这是我的JavaScript,它使用jQuery:

NProgress.start();
mixpanel.init("<CENSORED FOR SECURITY>");
mixpanel.track("Page Loads");
NProgress.done();
$(document).ready(function(){
if (Modernizr.localstorage) {
    console.log("L.S.W.");
} else {
    $(".errors").append("<div class="alert alert-danger alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;<\/span><span class="sr-only">Close<\/span><\/button><strong>Oh snap!<\/strong> Local Storage doesn't work on your browser. Saving won't work, so you might want to keep this open if you want to keep your notes.<\/div>");
    NProgress.done();
};
$("#save").click(function() {
    localStorage["note"] = JSON.stringify($(".editor").html());
});
$("#view").click(function() {
    if (localStorage["note"] != null) {
        var contentsOfOldDiv = JSON.parse(localStorage["note"]);
        $(".editor").    
        $("div.fifth").replaceWith(contentsOfOldDiv);
    } else {
        $(".errors").append("<div class=alert alert-info alert-dismissible> role="alert"><button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;<\/span><span class="sr-only">Close<\/span><\/button><strong>Heads up!<\/strong> No save was detected. Did you save before?<\/div>");
    };
});
});

那么我做错了什么呢?我从另一个堆栈溢出主题获得了JSON解析的想法

您有几个语法问题。例如,下面的行:

$(".errors").append("<div class="alert alert-danger alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;<\/span><span class="sr-only">Close<\/span><\/button><strong>Oh snap!<\/strong> Local Storage doesn't work on your browser. Saving won't work, so you might want to keep this open if you want to keep your notes.<\/div>");
如果您修复了报价问题,则会出现以下错误:

Uncaught ReferenceError: mixpanel is not defined 

继续浏览控制台中的错误,看看是否可以通过这种方式缩小问题的范围。

能否提供指向JFIDLE的链接?能否使问题的标题更具体?我认为,如果人们将来遇到类似的问题,可以更容易地找到解决方案。将问题标题设置为建设性标题将有助于您和其他用户更好地理解问题的开头部分以$.errors开头的行。附录能否缩小问题的范围,只提供直接涉及的代码?好的-我会试试这个。如果我有任何进展,我会回应。除了点符号错误,我解决了所有问题。然后我用它测试了一下,结果还是不起作用!有什么想法吗?另外,在我的最新版本中,我用我添加的引导模式代码替换了.append错误。它消除了许多不同的错误。
Uncaught SyntaxError: Unexpected identifier 
Uncaught ReferenceError: mixpanel is not defined