кнопка не будет выполнять функцию нажатия в html-сервисе скрипта Google Apps - PullRequest
Новая
       12

кнопка не будет выполнять функцию нажатия в html-сервисе скрипта Google Apps

1 голос
/ 02 июня 2019

Я потратил 2 дня, пытаясь понять это, поэтому любая помощь приветствуется.

Я следил за этим миленьким сериалом видеоуроков и я хотел бы попробовать что-то простое, прежде чем идти дальше: получить кнопку html, чтобы показать предупреждение javascript, используя скрипт приложений Google и их компонент HTML-службы, но я не могу понять, почему предупреждение не сработало.

Вот мой код

Index.html 

    <!DOCTYPE html>
        <html>
          <head>
              <script>
                 document.getElementById("btnSearch")
                         .addEventListener("click",showAlert);                
              function showAlert() {
                alert("hello world");
              }
              </script>
          </head>
          <body>
            <div>
              <label>Enter code</label>
              <input type="text" id="txtStudentID"/>
              <button id="btnSearch">Search</button>
            </div>
          </body>
        </html>

и мой code.gs 

function doGet() {
  return HtmlService.createHtmlOutputFromFile('Index');
}

Я также пробую, как Google показывает это здесь : но я все еще не получаю сигнал тревоги после нажатия кнопки: 

<input type="button" value="Search"
      onclick="google.script.run
          .withSuccessHandler(showAlert)
          .withUserObject(this)" />

все, что начинается с «document.getElementByID ...» внутри тегов скрипта, просто не будет работать

Что мне не хватает? это больше не поддерживается GAPS? Есть ли другой / правильный способ заставить это работать?

Заранее спасибо.

Ответы [ 2 ]

2 голосов
/ 02 июня 2019

все, что начинается с «document.getElementByID ...» внутри тегов скрипта, просто не будет работать

Да. Поскольку во время оценки тегов сценария нет элемента с идентификатором btnSearch.

Решение (ы):

  • Переместить скрипт в конец DOM. 
<div>
  <label>Enter code</label>
  <input type="text" id="txtStudentID" />
  <button id="btnSearch">Search</button>
</div>

<script>
  function showAlert() {
    alert('hello world');
  }
  document.getElementById('btnSearch').addEventListener('click', showAlert);
</script>
  • В качестве альтернативы, как указано в предыдущем ответе, используйте триггер load; чтобы сценарий оценивался после загрузки DOM. 
<script>
  function showAlert() {
    alert('hello world');
  }
  function load1() {
    document.getElementById('btnSearch').addEventListener('click', showAlert);
  }
  window.addEventListener('load', load1);
</script>
0 голосов
/ 02 июня 2019

Попробуйте добавить addEvent в window.onload

...