如何获取 URL 参数并将其传递给 HTML 输出

Question

I am making a code that requests course grades and sends them to a spreadsheet.我正在制作一个请求课程成绩并将其发送到电子表格的代码。 I am familiar with Javascript;我熟悉Javascript； however, I am less familiar with HTML.但是，我对 HTML 不太熟悉。 Because not every person is taking the same courses or even the same number of courses, I wanted to send each student a custom url that contains the parameters of their name and what courses they are taking.因为不是每个人都参加相同的课程甚至相同数量的课程，我想向每个学生发送一个自定义 url，其中包含他们的姓名参数和他们正在参加的课程。 That way the information could be populated into the HTML page and all the student would need to do is type in their grades for the corresponding courses.这样，信息就可以填充到 HTML 页面中，学生所需要做的就是输入相应课程的成绩。 Then when submitted, it would send that information to a spreadsheet and handled accordingly.然后，当提交时，它会将该信息发送到电子表格并进行相应处理。 However, I am unsure of how I could pass parameters on to an HTML page.但是，我不确定如何将参数传递给 HTML 页面。 I am sure that it is simple but I dont know how to do it.我相信这很简单，但我不知道该怎么做。 If someone could provide some guidance it would be greatly appreciated.如果有人可以提供一些指导，将不胜感激。 Below I have included the main HTML file that dictates the output.下面我包含了指示输出的主要 HTML 文件。 I am also including links to the other code.我还包括指向其他代码的链接。 https://script.google.com/d/1c2XOZc5bmlnxT0ayWfYpJd4d6pKmZ8rgSiEZ-9NJ8CZIhvdjpEqSJ5X6/edit?usp=sharing 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>

Answer 1

You can use google.script.url.getLocation() to get the current URL parameters and hash.您可以使用google.script.url.getLocation()获取当前 URL 参数和哈希值。

<!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>

如何获取 URL 参数并将其传递给 HTML 输出

问题描述

1 个解决方案

解决方案1
0 2020-11-25 11:06:10

如何获取 URL 参数并将其传递给 HTML 输出

问题描述

1 个解决方案

解决方案1 0 2020-11-25 11:06:10

解决方案1
0 2020-11-25 11:06:10