Как использовать функцию DOM в EJS - PullRequest
Новая
       13

Как использовать функцию DOM в EJS

1 голос
/ 09 марта 2019

Я пытаюсь создать функцию на веб-странице, когда пользователь нажимает кнопку «Отправить», она переходит в функцию EJS, но мне нужна функция DOM для изменения элементов, но документ не определен в EJS, что я могу сделать. 

<p id="resMessage"></p>
    <div id="generalSettings" class="main-menu-content">
      <% if (showData.prefix) { %>
        <%
        function savePrefix() {
          try {
            configData({
              'prefix': document.getElementById('resMessage') <=== this is not defined
            });
            %>
            <script type="text/javascript">
              var resMessage = document.getElementById("resMessage")
              resMessage.style.backgroundColor = 'green';
              resMessage.innerHTML = "Success!"
            </script>
            <%
          } catch (err) {
            if (err) {
              %>
              <script type="text/javascript">
                var resMessage = document.getElementById("resMessage")
                resMessage.style.backgroundColor = 'red';
                resMessage.innerHTML = `Error: ${err.toString()}`
              </script>
              <%
              console.log(err)
            };
          };
        };
        %>
        <input type="text" id="prefix" value=<%= showData.prefix %> maxlength="6"><input type="submit" onclick=<%= savePrefix() %>>
      <% } %>
    </div>

1 Ответ

0 голосов
/ 09 марта 2019

ejs - это язык шаблонов , что означает, что он только контролирует как отображение страницы и ничего не меняет, что происходит со страницей в браузере клиента после ее загрузки,

Изменение кода на это должно решить проблему: 

<p id="resMessage"></p>
<div id="generalSettings" class="main-menu-content">
   <% if (showData.prefix) { %>
   <script type="text/javascript">
      function savePrefix() {
        try {
          configData({
            'prefix': document.getElementById('resMessage') 
          });
        var resMessage = document.getElementById("resMessage")
        resMessage.style.backgroundColor = 'green';
        resMessage.innerHTML = "Success!"
      } catch (err) {
          var resMessage = document.getElementById("resMessage")
          resMessage.style.backgroundColor = 'red';
          resMessage.innerHTML = `Error: ${err.toString()}`
        console.log(err);
      }
      }
   </script>
   <input type="text" id="prefix" value="<%= showData.prefix %>" maxlength="6"><input type="submit" onclick="<%= savePrefix() %>">
   <% } %>
</div>
...