GAS运行时如何通过HTML选择spreadsheetID等参数修改指定单元格值

你需要的交互写入方案完全可以实现，无需依赖外部站点，纯GAS+HTML前端交互即可完成所有操作，以下是完整实现逻辑和可直接复用的代码示例：

核心实现逻辑 #

• 前端HTML侧设置交互控件：Spreadsheet ID输入框、工作表名下拉框、目标单元格输入项、提交按钮，所有控件都可以绑定onchange事件实现联动
• 借助google.script.runAPI实现前端和GAS后端的异步通信，输入Spreadsheet ID后自动触发事件拉取对应表格的所有工作表名称，填充到下拉选项
• 选完所有参数后提交请求，调用GAS后端方法直接写入目标单元格，你可以固定写入第63行E列，也可以支持自定义选择单元格

后端code.gs代码 #

// Web App部署入口函数
function doGet() {
  return HtmlService.createHtmlOutputFromFile('index')
    .setTitle('表格数据写入工具')
    .setWidth(500);
}

// 根据传入的Spreadsheet ID获取对应表格的所有工作表名称
function getSheetNames(spreadsheetId) {
  try {
    const targetSs = SpreadsheetApp.openById(spreadsheetId);
    return targetSs.getSheets().map(sheet => sheet.getName());
  } catch (e) {
    return [];
  }
}

// 写入目标单元格的核心方法
function writeToTargetCell(params) {
  const { spreadsheetId, sheetName, targetCell, writeValue } = params;
  try {
    const targetSs = SpreadsheetApp.openById(spreadsheetId);
    const targetSheet = targetSs.getSheetByName(sheetName);
    // 固定写入63行E列可直接替换为targetSheet.getRange(63,5)，无需传targetCell参数
    const targetRange = targetSheet.getRange(targetCell);
    targetRange.setValue(writeValue);
    return { success: true, msg: '写入成功' };
  } catch (e) {
    return { success: false, msg: `写入失败：${e.message}` };
  }
}

前端index.html代码 #

<!DOCTYPE html>
<html>
  <body>
    <div style="padding: 20px;">
      <div style="margin-bottom: 15px;">
        <label>Spreadsheet ID：</label>
        <input type="text" id="spreadsheetId" placeholder="输入目标表格ID" onchange="getSheetList()" style="width: 300px;">
      </div>
      <div style="margin-bottom: 15px;">
        <label>工作表名称：</label>
        <select id="sheetName" disabled>
          <option value="">请先输入表格ID</option>
        </select>
      </div>
      <div style="margin-bottom: 15px;">
        <label>目标单元格：</label>
        <input type="text" id="targetCell" placeholder="例如E63" value="E63" style="width: 100px;">
      </div>
      <div style="margin-bottom: 15px;">
        <label>写入内容：</label>
        <input type="text" id="writeValue" placeholder="输入要写入的值" style="width: 300px;">
      </div>
      <button onclick="submitWrite()" style="padding: 8px 20px;">确认写入</button>
      <p id="msg" style="margin-top: 15px;"></p>
    </div>
    <script>
      // 输入表格ID后自动拉取工作表列表
      function getSheetList() {
        const ssId = document.getElementById('spreadsheetId').value.trim();
        if (!ssId) return;
        document.getElementById('sheetName').disabled = true;
        google.script.run
          .withSuccessHandler(sheets => {
            const select = document.getElementById('sheetName');
            select.innerHTML = '';
            sheets.forEach(name => {
              const option = document.createElement('option');
              option.value = name;
              option.textContent = name;
              select.appendChild(option);
            });
            select.disabled = sheets.length === 0;
          })
          .getSheetNames(ssId);
      }
      // 提交写入请求
      function submitWrite() {
        const params = {
          spreadsheetId: document.getElementById('spreadsheetId').value.trim(),
          sheetName: document.getElementById('sheetName').value,
          targetCell: document.getElementById('targetCell').value.trim(),
          writeValue: document.getElementById('writeValue').value.trim()
        };
        if (!params.spreadsheetId || !params.sheetName || !params.writeValue) {
          document.getElementById('msg').textContent = '请补全所有必填项';
          return;
        }
        google.script.run
          .withSuccessHandler(res => {
            document.getElementById('msg').textContent = res.msg;
          })
          .writeToTargetCell(params);
      }
    </script>
  </body>
</html>

注意事项 #

• 部署Web App时，权限设置要根据使用场景调整为「任何人，甚至匿名用户」或「你所在组织内的用户」，同时确保当前脚本执行身份对目标Spreadsheet有编辑权限
• 如果不需要自定义单元格，可直接删除前端的targetCell输入项，后端固定写targetSheet.getRange(63,5)即可强制写入第63行E列
• 所有交互均为异步完成，无需跳转页面，选择参数后直接提交即可完成写入操作

内容的提问来源于stack exchange，提问作者shane