javascript - 语法错误 : missing : after property id when html file inspection

原文 标签 javascript jquery html

我已经创建了光滑的 slider 。

这是我的代码:

<!DOCTYPE HTML>
<html>
  <head>
  <meta charset = "utf-8" />
  <title>My Now Amazing Webpage</title>
  <link rel="stylesheet" type="text/css" href="slick.css"/>
  <link rel="stylesheet" type="text/css" href="slick-theme.css"/>
  </head>
  <body>

  <div class="slick-slider">          
          <img id="graphic1" class="carousel-image" alt="Image Caption" src="//cdn.shopify.com/s/files/1/0057/7782/products/img1_4e3a619a-0daa-439c-968b-6970fe8a7b1f_1024x1024.jpg?v=1434978806" width="564px"></a>
          <img id="graphic2" class="carousel-image" alt="Image Caption" src="//cdn.shopify.com/s/files/1/0057/7782/products/img1_1024x1024.jpg?v=1434488016" width="564px"></a>
          <img id="graphic3" class="carousel-image" alt="Image Caption" src="//cdn.shopify.com/s/files/1/0057/7782/products/img2_780e862e-5c3e-4245-82a4-e13f4bc8b19b_1024x1024.jpg?v=1434450473" width="564px"></a>
          <img id="graphic4" class="carousel-image" alt="Image Caption" src="//cdn.shopify.com/s/files/1/0057/7782/products/img3_ac753481-98f3-4f28-bfc5-ec9443a9ff4c_1024x1024.jpg?v=1434488053" width="564px"></a>
  </div>
  <script type="text/javascript">
    $(document).ready(function(){
      $('.slick-slider').slick({
        setting-name: setting-value
      });
    });
  </script>

  <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
  <script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
  <script type="text/javascript" src="slick.min.js"></script>
  </body>
</html>

当我检查此文件时,它显示如下内容:

SyntaxError: missing : after property id



我可以知道,如何解决这个问题?

任何帮助将不胜感激。

谢谢。

最佳答案

首先没有setting-name如果我没记错的话,slick.js 中的选项。

其次,作为选项提供给 js 的 JSON 对象是无效的,因为 setting-name有一个 -这是一个减法表达式。您必须改用这样的引号

$('.slick-slider').slick({
  "setting-name": "setting-value"
});

根据评论,错误 $ is not defined是因为脚本文件没有按正确的顺序放置。您的 HTML 文件应如下所示
<!DOCTYPE HTML>
<html>
  <head>
  <meta charset = "utf-8" />
  <title>My Now Amazing Webpage</title>
  <link rel="stylesheet" type="text/css" href="slick.css"/>
  <link rel="stylesheet" type="text/css" href="slick-theme.css"/>
  </head>
  <body>

  <div class="slick-slider">          
          <img id="graphic1" class="carousel-image" alt="Image Caption" src="//cdn.shopify.com/s/files/1/0057/7782/products/img1_4e3a619a-0daa-439c-968b-6970fe8a7b1f_1024x1024.jpg?v=1434978806" width="564px"></a>
          <img id="graphic2" class="carousel-image" alt="Image Caption" src="//cdn.shopify.com/s/files/1/0057/7782/products/img1_1024x1024.jpg?v=1434488016" width="564px"></a>
          <img id="graphic3" class="carousel-image" alt="Image Caption" src="//cdn.shopify.com/s/files/1/0057/7782/products/img2_780e862e-5c3e-4245-82a4-e13f4bc8b19b_1024x1024.jpg?v=1434450473" width="564px"></a>
          <img id="graphic4" class="carousel-image" alt="Image Caption" src="//cdn.shopify.com/s/files/1/0057/7782/products/img3_ac753481-98f3-4f28-bfc5-ec9443a9ff4c_1024x1024.jpg?v=1434488053" width="564px"></a>
  </div>

  <script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
  <script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
  <script type="text/javascript" src="slick.min.js"></script>
  <script type="text/javascript">
    $(document).ready(function(){
      $('.slick-slider').slick({
        setting-name: setting-value
      });
    });
  </script>
  </body>
</html>

这是一个演示 http://jsbin.com/kiyeno/edit?html,output

关于javascript - 语法错误 : missing : after property id when html file inspection,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31746603/

相关文章:

jquery - 文本框自动完成返回 404 错误,找不到 Controller /操作

html - 名称长度的 CSS 家谱对齐问题

javascript - Sweetalert JS在php中更新后使用窗口位置重定向

javascript - 如果不使用模板中的特定 vuex 状态,单击处理程序将不起作用

javascript - WordPress的-重力形式-如何启用JavaScript验证?

javascript - HTML img 标签自动刷新浏览器导致图片撕裂

html - Chrome 中的渲染错误

javascript - 如何将来自不同组件的 firebase auth 和 Cloud Firestore 用作单个 firebase 应用程序

javascript - 滚动到错误的字段ERROR

jquery - 阻止 body 滚动的更好方法?