获取新增Textarea值插入Google Sheets的代码排障请求

我有一个包含多个Textarea的页面，支持新增Textarea选项，点击「Send data」按钮要把数据插入到Google Sheets，但目前无法成功提交，不确定是HTML前端还是Google Apps Script后端的问题，也不知道怎么排查嵌入HTML的脚本错误，需要帮忙排查代码问题。

现有HTML代码 #

<!DOCTYPE html>
<html>
<body>
  <div class="container">
    <input type="text" id="qnumberDS" placeholder="Enter question">

    <textarea id="contentDS" placeholder="Enter question content"></textarea>

    <div class="options">
      <div class="option">
        <input type="checkbox" id="ch1" class="checkbox">
        <textarea id="a" class="option-textarea" placeholder="Enter option A"></textarea>
      </div>
      <div class="option">
        <input type="checkbox" id="ch2" class="checkbox">
        <textarea id="b" class="option-textarea" placeholder="Enter option "></textarea>
      </div>
      <div class="option">
        <input type="checkbox" id="ch3" class="checkbox">
        <textarea id="c" class="option-textarea" placeholder="Enter option C"></textarea>
      </div>
      <div class="option">
        <input type="checkbox" id="ch4" class="checkbox">
        <textarea id="d" class="option-textarea" placeholder="Enter option D"></textarea>
      </div>
      </div>

    <button id="insertRow">Add options</button>

    <button id="insertValue">Send data</button>
  </div>

  <script>
    
const qnumberDSInput = document.getElementById('qnumberDS');
const contentDSInput = document.getElementById('contentDS');
const optionsContainer = document.querySelector('.options');
const insertRowButton = document.getElementById('insertRow');
const insertValueButton = document.getElementById('insertValue');


function insertRow() {
  const newOption = document.createElement('div');
  newOption.classList.add('option');

  const newCheckbox = document.createElement('input');
  newCheckbox.type = 'checkbox';
  newCheckbox.id = `ch${optionsContainer.children.length + 1}`;
  newCheckbox.classList.add('checkbox');
  newOption.appendChild(newCheckbox);

  const newTextarea = document.createElement('textarea');
  newTextarea.id = String.fromCharCode(97 + optionsContainer.children.length);
  newTextarea.classList.add('option-textarea');
  newTextarea.placeholder = `Nhập phương án ${String.fromCharCode(97 + optionsContainer.children.length)}`;
  newOption.appendChild(newTextarea);

  optionsContainer.appendChild(newOption);
}


function insertValue() {
  const title = qnumberDSInput.value;
  const content = contentDSInput.value;

  const data = [];

  optionsContainer.querySelectorAll('.option').forEach((option, index) => {
    const checkbox = option.querySelector('.checkbox');
    const textarea = option.querySelector('.option-textarea');

    const optionValue = textarea.value;
    const isChecked = checkbox.checked;

    const optionData = {
      value: optionValue,
      isCorrect: isChecked ? 'Đ' : 'S'
    };
    if (!data[data.length - 1].options) {
      data[data.length - 1].options = [];
    }

    data[data.length - 1].options.push(optionData);
  });

  google.script.run.enterNameDS(data);
}

insertRowButton.addEventListener('click', insertRow);
insertValueButton.addEventListener('click', insertValue);

  </script>
</body>
</html>

现有Google Apps Script代码 #

function enterNameDS(data) {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var shTitle = ss.getSheetByName('title');
  var sh = ss.getSheetByName('tests');

  var numPart1 = Number(shTitle.getRange('E8').getValue());

 data.forEach(question => {
    const formulas = [question.title, `="${question.content}"`];

    question.options.forEach(option => {
      formulas.push(`=if(column()=${option.position + 3};"${option.value}";"")`);
    });

    sh.getRange(numPart1 + 1, 1, 1, formulas.length).setFormulas([formulas]);

    numPart1++;
  });

 shTitle.getRange('E8').setValue(numPart1);
}

问题排查与修正 #

前端（HTML/JS）核心问题 #

1. 数据结构初始化错误：insertValue函数中data数组初始为空，直接访问data[data.length - 1].options会触发Cannot read properties of undefined错误，因为数组没有初始元素。
2. 题目基础数据缺失：未将title和content存入data对象，导致后端无法读取这两个字段。
3. 选项缺少position字段：后端用到option.position但前端未赋值，会导致公式出现NaN。

修正后的insertValue函数：

function insertValue() {
  const title = qnumberDSInput.value;
  const content = contentDSInput.value;

  // 初始化题目数据结构
  const questionData = {
    title: title,
    content: content,
    options: []
  };

  optionsContainer.querySelectorAll('.option').forEach((option, index) => {
    const checkbox = option.querySelector('.checkbox');
    const textarea = option.querySelector('.option-textarea');

    const optionValue = textarea.value;
    const isChecked = checkbox.checked;

    const optionData = {
      value: optionValue,
      isCorrect: isChecked ? 'Đ' : 'S',
      position: index // 添加position字段
    };
    questionData.options.push(optionData);
  });

  const data = [questionData];
  google.script.run.enterNameDS(data);
}

后端（Google Apps Script）核心问题 #

1. 公式分隔符不兼容：代码中用分号;作为公式参数分隔符，Google Sheets多数地区环境使用逗号,，会导致公式解析失败。
2. 缺少异常处理：未判断工作表是否存在、E8单元格值是否为有效数字，容易触发未知错误。

修正后的enterNameDS函数：

function enterNameDS(data) {
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var shTitle = ss.getSheetByName('title');
  var sh = ss.getSheetByName('tests');

  // 检查工作表是否存在
  if (!shTitle || !sh) {
    throw new Error('找不到指定工作表：title或tests');
  }

  var numPart1 = Number(shTitle.getRange('E8').getValue());
  // 处理E8无有效数字的情况
  if (isNaN(numPart1)) numPart1 = 1;

  data.forEach(question => {
    // 跳过空题目数据
    if (!question.title || !question.content) return;

    const formulas = [question.title, `="${question.content}"`];

    question.options.forEach((option, index) => {
      // 替换分号为逗号，适配多数地区设置
      formulas.push(`=if(column()=${index + 3},"${option.value}","")`);
    });

    sh.getRange(numPart1 + 1, 1, 1, formulas.length).setFormulas([formulas]);
    numPart1++;
  });

  shTitle.getRange('E8').setValue(numPart1);
}

脚本错误排查方法 #

• 前端调试：按F12打开浏览器开发者工具，切换到Console标签，点击提交按钮查看JS报错信息。
• 后端调试：在GAS函数中添加Logger.log(data)，执行后通过GAS编辑器的「查看」→「日志」查看传入数据；也可用try-catch捕获异常并记录。

内容的提问来源于stack exchange，提问作者Lê Phong Nguyễn