Javascript 未捕获语法错误：意外标识符game.js:25_Javascript

Javascript 未捕获语法错误：意外标识符game.js:25

javascript

Javascript 未捕获语法错误：意外标识符game.js:25,javascript,Javascript,我正在制作我的第一个flask应用程序，它是一个文本冒险和一个单独的部分来留下评论。我试着跟随一个文本冒险教程。我已经让我的网站运行，但是当我刷新页面以查看我的进度时，game.js中的更改没有反映出来，我遇到了标题中的错误这是我关于堆栈溢出的第一篇文章，所以我把所有代码都放在下面。提前感谢您的帮助！我还是个新手，帕迪，我为我犯的愚蠢错误感到抱歉 game.js const textElement = document.getElementById('text') const optionsB

我正在制作我的第一个flask应用程序，它是一个文本冒险和一个单独的部分来留下评论。我试着跟随一个文本冒险教程。我已经让我的网站运行，但是当我刷新页面以查看我的进度时，game.js中的更改没有反映出来，我遇到了标题中的错误

这是我关于堆栈溢出的第一篇文章，所以我把所有代码都放在下面。提前感谢您的帮助！我还是个新手，帕迪，我为我犯的愚蠢错误感到抱歉

game.js

const textElement = document.getElementById('text')
const optionsButtonsElement = document.getElementById('options-buttons')

let state = {}

function startGame() {
  state = {}
  showTextNode(1)
}

function showTextNode(textNodeIndex) {
  const textNode = textNodes.find(textNode => textNode.id === textNodeIndex)
  textElement.innerText = textNode.text
  while (optionsButtonsElement.firstChild)
    optionsButtonsElement.removeChild(optionsButtonsElement.firstChild)
}

function selectOption(option) {

}

const textNodes = [
  {
    id:1
    text: 'You wake up staring at the ceiling of your bunker.',
    options [
      {
        text: 'Turn on the radio',
        nextText: 2
      },
      {
        text: 'Grab your pistol and pack up the remainder of your supplies.',
      }
    ]
  }
]

startGame()

game.html


{% block title %}Get ready to play!{% endblock %}

{% block content %}


<body>
    <div class="container">
        <div id="text">Text</div> <br/>
        <div id="option-buttons" class="btn-grid">
            <button type="button" class="btn btn-outline-dark btn-lg btn-block">Option 1</button>
            <button type="button" class="btn btn-outline-dark btn-lg btn-block">Option 2</button>
            <button type="button" class="btn btn-outline-dark btn-lg btn-block">Option 3</button>
            <button type="button" class="btn btn-outline-dark btn-lg btn-block">Option 4</button>
            <script src="{{ url_for('static', filename='js/game.js')}}"></script>
    </div>
</body>


{% endblock %}


{%block title%}准备好游戏吧！{%endblock%}
{%block content%}
文本

选择1
选择2
选择3
选择4
{%endblock%}

app.py

from flask import Flask, render_template, request, redirect
from flask_sqlalchemy import SQLAlchemy
from datetime import datetime

app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///posts.db'
#Initialising the database
db = SQLAlchemy(app)

#Creating a database model
class Posts(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    content = db.Column(db.String(200), nullable=False)
    date_created = db.Column(db.DateTime, default=datetime.utcnow)
    
    #Creating a function to return a string when a post is added to db
    def __repr__(self):
        return '<Content %r>' % self.id


@app.route('/')
def index():
    return render_template("index.html")

@app.route('/game')
def game():
    return render_template("game.html")

@app.route('/blog', methods=['POST', 'GET'])
def blog():

    if request.method == "POST":
        post_content = request.form['content']
        new_post = Posts(content=post_content)

        try: #Push the blog post to the db
            db.session.add(new_post)
            db.session.commit()
            return redirect('/blog')
        except:
            return "There was an error adding your post"
    
    else:
        posts = Posts.query.order_by(Posts.date_created)
        return render_template("blog.html", posts=posts)

@app.route('/update/<int:id>' , methods=['POST', 'GET'])
def update(id):
    post_to_update = Posts.query.get_or_404(id)
    if request.method == "POST":
        post_to_update.content = request.form['content']
        try:
            db.session.commit()
            return redirect('/blog')
        except:
            return "There was a problem updating your blog post"
    else:
        return render_template('update.html', post_to_update=post_to_update)

@app.route('/delete/<int:id>')
def delete(id):
    post_to_delete = Posts.query.get_or_404(id)

    try:
        db.session.delete(post_to_delete)
        db.session.commit()
        return redirect('/blog')

    except:
        return "There was a problem deleting this post :("

从flask导入flask，呈现\u模板，请求，重定向
从flask_sqlalchemy导入sqlalchemy
从日期时间导入日期时间
app=烧瓶（名称）
app.config['SQLALCHEMY\u DATABASE\u URI']='sqlite:///posts.db'
#初始化数据库
db=SQLAlchemy（应用程序）
#创建数据库模型
班级职位（db.Model）：
id=db.Column（db.Integer，主键=True）
content=db.Column（db.String（200），null=False）
创建日期=db.Column（db.DateTime，默认值=DateTime.utcnow）
#创建函数以在将post添加到db时返回字符串
定义报告（自我）：
返回“%self.id”
@应用程序路径（“/”）
def index（）：
返回渲染模板（“index.html”）
@app.route（“/game”）
def game（）：
返回渲染模板（“game.html”）
@app.route（'/blog'，methods=['POST'，'GET']）
def blog（）：
如果request.method==“POST”：
post_content=request.form['content']
新帖子=帖子（内容=帖子内容）
尝试：#将博客文章推送到数据库
db.session.add（新帖子）
db.session.commit（）
返回重定向（“/blog”）
除：
return“添加帖子时出错”
其他：
posts=posts.query.order\u by（posts.date\u创建）
返回呈现模板（“blog.html”，posts=posts）
@app.route（'/update/'，methods=['POST'，'GET']）
def更新（id）：
post\u to\u update=Posts.query.get\u或\u 404（id）
如果request.method==“POST”：
post_to_update.content=request.form['content']
尝试：
db.session.commit（）
返回重定向（“/blog”）
除：
return“更新日志时出现问题”
其他：
返回渲染模板（'update.html'，post\u to\u update=post\u to\u update）
@app.route（“/delete/”）
def删除（id）：
post\u to\u delete=Posts.query.get\u或\u 404（id）
尝试：
db.session.delete（post_to_delete）
db.session.commit（）
返回重定向（“/blog”）
除：
return“删除此帖子时出现问题：（“

my base.html模板

<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">

    <title>
      {% block title %}GEN TITLE{% endblock %}
    </title>
  </head>

<body>
  <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
  <a class="navbar-brand" href="{{ url_for('index')}}">Patricks Site</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
  <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
  <ul class="navbar-nav mr-auto">
  <li class="nav-item active">
  <a class="nav-link" href="{{ url_for('index')}}">Home <span class="sr-only">(current)</span></a>
  </li>
    <li class="nav-item">
    <a class="nav-link" href="{{ url_for('game')}}">Game</a>
    </li>
    <li class="nav-item">
    <a class="nav-link" href="{{ url_for('blog')}}">Blog</a>
    </li>
    </ul>
  </div>
</nav> 


</br>


<!-- Optional JavaScript; choose one of the two! -->

    <!-- Option 1: jQuery and Bootstrap Bundle (includes Popper) -->
    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ho+j7jyWK8fNQe+A12Hb8AhRq26LrZ/JpcUGGOn+Y7RsweNrtN/tE3MoK7ZeZDyx" crossorigin="anonymous"></script>

    <!-- Option 2: jQuery, Popper.js, and Bootstrap JS
    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js" integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s" crossorigin="anonymous"></script>
    -->

  {% block content %} 

  {% endblock %}
</body>
</html>


{%block title%}GEN title{%endblock%}










{%block content%}
{%endblock%}

很抱歉，我不太确定我应该显示多少内容。谢谢你的错误告诉你查看

game.js

的第25行

您似乎在该行的

选项

之后缺少一个冒号，在

id:1

之后缺少一个逗号。您有：

const textNodes = [
  {
    id:1
    text: 'You wake up staring at the ceiling of your bunker.',
    options [...],

你需要：

const textNodes = [
  {
    id:1,
    text: 'You wake up staring at the ceiling of your bunker.',
    options: [...],

你在游戏的

textNodes

数组中的

id:1

后错过了逗号。js谢谢Robert，我又回来了。chrome出现问题，没有用更改更新game.js文件，但在清除浏览数据后，一切似乎都正常了！：）很高兴听到这个消息！如果这回答了您的问题，请将其标记为“已接受”。