Google Spreadsheet模态对话框添加说明后按钮无响应问题

问题原因 #

你添加的说明文字使用了未闭合的<p>标签，浏览器自动解析时会打乱表单的DOM结构，导致按钮点击事件中this.parentNode无法正确指向表单元素，最终google.script.run无法获取表单数据并执行上传函数。

修复方案 #

以下两种方式任选其一即可：

方式一：修复HTML标签结构

将未闭合的<p>替换为完整的闭合标签<p>...</p>，保证DOM结构正常：

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
  </head>
  <form style="font-size:16px">
    <p>1) 在ML的销售列表中，筛选要处理的时间段，下载销售Excel。</p>
    <p>2) 在Contabilium的销售列表中，筛选要处理的时间段，导出简易Excel。</p>
    <p>3) 上传两个文件：</p>
    Excel MercadoLibre &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input type="file" name="fileML">
    <br>
    <br>
    Excel Contabilium &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input type="file" name="fileContabilium">
    <br><br><br>
     <input type="button" value="Importar" class="action" style="font-size:16px; height: 150px; text-align:center;" 
        onclick="google.script.run
            .withSuccessHandler(google.script.host.close)
            .uploadFile(this.parentNode)" />
    </form>
</html>

方式二：直接通过选择器获取表单

不依赖this.parentNode，改用选择器直接定位表单元素，避免DOM结构变化影响功能：

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
  </head>
  <form style="font-size:16px">
    1) 在ML的销售列表中，筛选要处理的时间段，下载销售Excel。<p>
    2) 在Contabilium的销售列表中，筛选要处理的时间段，导出简易Excel。<p>
    3) 上传两个文件：<p>
    Excel MercadoLibre &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input type="file" name="fileML">
    <br>
    <br>
    Excel Contabilium &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input type="file" name="fileContabilium">
    <br><br><br>
     <input type="button" value="Importar" class="action" style="font-size:16px; height: 150px; text-align:center;" 
        onclick="google.script.run
            .withSuccessHandler(google.script.host.close)
            .uploadFile(document.querySelector('form'))" />
    </form>
</html>

注：代码已合并按钮重复的style属性，写法更规范。

内容的提问来源于stack exchange，提问作者Agustina Botas May