Question

有人可以告诉我这段代码中的JavaScript有什么问题吗？它说＆＃34;输入意外结束＆＃34;，但我没有看到任何错误。我的所有陈述似乎都在某个时候结束，每个语法检查器都说没有检测到错误。

<!DOCTYPE html>
<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <title>Slide Editor</title>
    <style>
      @font-face {
        font-family: SegoeUILight;
        src: url(Segoe_UI_Light.ttf);
      }

      * {
        font-family: SegoeUILight;
      }
    </style>
    <script src="Slide/RevealJS/lib/js/html5shiv.js"></script>
    <script src="Slide/RevealJS/lib/js/head.min.js"></script>
  </head>

  <body onload="editSlideshow()">
    <div id="sl">
      <span id="sls"></span>
    </div>
    <span id="slt"></span>
    <div id="editor">
    </div>
    <script>
      function getURLParameters(paramName) {
        var sURL = window.document.URL.toString();
        if (sURL.indexOf("?") > 0) {
          var arrParams = sURL.split("?");
          var arrURLParams = arrParams[1].split("&");
          var arrParamNames = new Array(arrURLParams.length);
          var arrParamValues = new Array(arrURLParams.length);

          var i = 0;
          for (i = 0; i < arrURLParams.length; i++) {
            var sParam = arrURLParams[i].split("=");
            arrParamNames[i] = sParam[0];
            if (sParam[1] != "")
              arrParamValues[i] = unescape(sParam[1]);
            else
              arrParamValues[i] = "No Value";
          }

          for (i = 0; i < arrURLParams.length; i++) {
            if (arrParamNames[i] == paramName) {
              //alert("Parameter:" + arrParamValues[i]);
              return arrParamValues[i];
            }
          }
          return "No Parameters Found";
        }
      }

      var name = getURLParameters("show");
      var slideCount = 1;

      function editSlideshow() {
        if (localStorage.getItem("app_slide_doc_" + name) == null) {
          $("#sls").append('<button onclick = "loadSlide\'1\')" id = "slide_1">Slide 1</button>');
          $("#sl").append('button onclick = "newSlide()">New Slide</button>');
          slideCount = 1;
        } else {
          var textArray = JSON.parse(localStorage.getItem("app_slide_doc_" + name));
          slideCount = textArray.length;
          var slideCnt = textArray.length - 1;
          for (var i = 0; i <= slideCnt; i++) {
            $("#sls").append('<button onclick = "loadSlide\'' + (i + 1) + '\')" id = "slide_' + (i + 1) + '">Slide ' + (i + 1) + '</button>');
          };
          $("sl").append('<button onclick = "newSlide()">New Slide</button>');
        };
      };

      function loadSlide(num) {
        var array = JSON.parse(localStorage.getItem("app_slide_doc_" + name));
        if (array == null) {
          document.getElementById("editor").innerHTML = "<p><textarea rows = '15' cols = '100' id = 'editTxt'></textarea></p>";
          document.getElementById("slt").innerHTML = "Slide " + num;
          $("#editor").append("<p><button onclick = 'saveSlide(\"" + num + "\")'>Save Slide</button><button onclick = 'deleteSlide(\"" + num + "\")'>Delete Slide</button></p>");
        } else if (array[num - 1] == null) {
          document.getElementById("editor").innerHTML = "<p><textarea rows = '15' cols = '100' id = 'editTxt'></textarea></p>";
          document.getElementById("slt").innerHTML = "Slide " + num;
          $("#editor").append("<p><button onclick = 'saveSlide(\"" + num + "\")'>Save Slide</button><button onclick = 'deleteSlide(\"" + num + "\")'>Delete Slide</button></p>");
        } else {
          var slideArray = JSON.parse(localStorage.getItem("app_slide_doc_" + name));
          var text = slideArray[num - 1];
          document.getElementById("editor").innerHTML = "<p><textarea rows = '15' cols = '100' id = 'editTxt'></textarea></p>";
          document.getElementById("editTxt").value = text;
          document.getElementById("slt").innerHTML = "Slide " + num;
          $("#editor").append("<p><button onclick = 'saveSlide(\"" + num + "\")'>Save Slide</button><button onclick = 'deleteSlide(\"" + num + "\")'>Delete Slide</button></p>");
        };
      };

      function saveSlide(num) {
        if (localStorage.getItem("app_slide_doc_" + name) == null) {
          var text = document.getElementById("editTxt").value;
          var textArray = new Array();
          textArray[num - 1] = text;
          localStorage.setItem("app_slide_doc_" + name, JSON.stringify(textArray));
        } else {
          var textArray = JSON.parse(localStorage.getItem("app_slide_doc_" + name));
          var text = document.getElementById("editTxt").value;
          textArray[num - 1] = text;
          localStorage.setItem("app_slide_doc_" + name, JSON.stringify(textArray));
        };
      };

      function newSlide() {
        var nextSlide = slideCount + 1;
        $("#sls").append('<button onclick = "loadSlide(\'' + nextSlide + '\')" id = "slide_' + nextSlide.toString() + '">Slide ' + nextSlide.toString() + '</button>');
        slideCount = nextSlide;
      };

      function deleteSlide(num) {
        if (localStorage.getItem("app_slide_doc_" + name) == null) {
          if (num !== "1") {
            $("#slide_" + num).remove();
            document.getElementById("editor").innerHTML = "";
            document.getElementById("slt").innerHTML = "";
            slideCount = slideCount - 1;
            location.reload();
          } else {
            alert("The first slide cannot be deleted.");
          };
        } else {
          var textArray = JSON.parse(localStorage.getItem("app_slide_doc_" + name));
          if (num !== "1") {
            $("#slide_" + num).remove();
            document.getElementById("editor").innerHTML = "";
            document.getElementById("slt").innerHTML = "";
            slideCount = slideCount - 1;
            textArray.splice((num - 1), 1);
            localStorage.setItem("app_slide_doc_" + name, JSON.stringify(textArray));
            location.reload();
          } else {
            alert("The first slide cannot be deleted.");
          };
        };
      };
    </script>
  </body>
</html>

Answer 1

您的多个onclick属性中的标点符号错误，例如：

$("#sls").append('<button onclick = "loadSlide\'1\')" id = "slide_1">Slide 1</button>');

它缺少左括号。语法检查不会立即捕获这个的原因是因为您将代码放入字符串中。你不应该这样做。

由于您正在使用jQuery，如何使用.click(function() { ... })而不是内联属性？只是要小心让你捕获的变量正确。

Answer 2

第63行的问题

$("#sl").append('button onclick = "newSlide()">New Slide</button>');

应该是：

$("#sl").append('<button onclick = "newSlide()">New Slide</button>');

意外的输入JavaScript结束

2 个答案: