首页 > 解决方案 > 如何获取 URL 参数并将其传递给 HTML 输出

问题描述

我正在制作一个请求课程成绩并将其发送到电子表格的代码。我熟悉 Javascript;但是,我对 HTML 不太熟悉。因为不是每个人都在学习相同的课程甚至相同数量的课程,所以我想向每个学生发送一个自定义 url,其中包含他们的姓名参数和他们正在学习的课程。这样,信息就可以填充到 HTML 页面中,学生只需输入相应课程的成绩即可。然后在提交时,它会将这些信息发送到电子表格并进行相应处理。但是,我不确定如何将参数传递到 HTML 页面。我确信这很简单,但我不知道该怎么做。如果有人可以提供一些指导,将不胜感激。下面我包含了指示输出的主要 HTML 文件。我还包括其他代码的链接。https://script.google.com/d/1c2XOZc5bmlnxT0ayWfYpJd4d6pKmZ8rgSiEZ-9NJ8CZIhvdjpEqSJ5X6/edit?usp=sharing

<!DOCTYPE html>
<html>
    <head>
        <base target="_top">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
        <?!= include('JavaScript'); ?>
    </head>
    <body>
        <div class="container">
            <div class="row">
                <div class="col-6">
                    <form id="myForm" onsubmit="handleFormSubmit(this)">
                        <p class="h4 mb-4 text-center">Input Grades Below</p>
                        <div class="form-row">
                           <div class="form-group col-md-6">
                               <label for="class001" id = "class_01" hidden>Class1</label>
                               <input type="text" class="form-control" id="grade001" name="grade00" placeholder="Grade" hidden>
                           </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label for="class002" id = class_02 hidden>Class2</label>
                                <input type="text" class="form-control" id="grade002" name="grade002" placeholder="Grade" hidden>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label for="class003" id = "class_03" hidden>Class3</label>
                                <input type="text" class="form-control" id="grade003" name="grade003" placeholder="Grade" hidden>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label for="class004" id = class_04 hidden>Class4</label>
                                <input type="text" class="form-control" id="grade004" name="grade004" placeholder="Grade" hidden>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label for="class005" id = class_05 hidden>Class5</label>
                                <input type="text" class="form-control" id="grade005" name="grade005" placeholder="Grade" hidden>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label for="class006" id = class_06 hidden>Class6</label>
                                <input type="text" class="form-control" id="grade006" name="grade006" placeholder="Grade" hidden>
                            </div>
                        </div>
                        <script>
                        //Script to to implement to change class labels
                        </script>
                        <button type="submit" class="btn btn-primary btn-block">Submit</button>
                    </form>
                    <div id="output"></div>
                </div>
            </div>      
        </div>
    </body>
</html>

标签: javascripthtmlgoogle-apps-script

解决方案


You can use google.script.url.getLocation() to get the current URL parameters and hash.

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <script>
      // URL = https://script.google.com/macros/s/SCRIPTKEY/exec?parameter=value#hash
      google.script.url.getLocation(function(location) {
        console.log(location.parameters); // {parameter: ["value"]}
        console.log(location.hash); // "hash"
      });
    </script>
  </body>
</html>

推荐阅读