JSP页面动态生成Text Area点击后仅显示1秒消失问题求助

嘿，这个问题我之前也碰到过！你遇到的textarea刚生成就消失的核心原因，大概率是按钮触发了表单默认提交行为，导致页面刷新——毕竟JSP页面里的按钮如果放在<form>标签里，默认是type="submit"类型，点击后浏览器会自动提交表单、刷新页面，刚生成的元素自然就没了。

给你两个简单直接的解决方案：

方案1：修改按钮类型为普通按钮 #

把你的生成按钮从默认的提交按钮改成普通按钮，这样点击时只会执行generate()函数，不会触发表单提交。

比如原来的按钮代码是这样的：

<input type="submit" onclick="generate()" value="生成题目">
<!-- 或者 -->
<button onclick="generate()">生成题目</button>

改成：

<input type="button" onclick="generate()" value="生成题目">
<!-- 或者 -->
<button type="button" onclick="generate()">生成题目</button>

只需要给按钮加上type="button"（<button>标签默认是submit，必须显式声明；<input>如果是submit类型，改成type="button"就行）。

方案2：在generate函数中阻止默认事件 #

如果不想改动按钮类型，可以在调用函数时传入事件对象，然后在函数内部阻止表单的默认提交行为：

首先修改按钮的点击事件，传入event参数：

<button onclick="generate(event)">生成题目</button>

然后更新你的JS函数：

function generate(e) {
  // 阻止表单默认提交行为
  e.preventDefault();
  
  // 以下是你原来的动态生成textarea的逻辑
  const questionCount = document.getElementById('your-input-id').value; // 替换成你的输入框ID
  const container = document.getElementById('textarea-container'); // 替换成存放textarea的容器ID
  
  // 先清空容器（可选，避免重复生成）
  container.innerHTML = '';
  
  // 循环生成textarea
  for (let i = 0; i < questionCount; i++) {
    const textarea = document.createElement('textarea');
    textarea.rows = 5;
    textarea.placeholder = `第${i+1}道题目`;
    container.appendChild(textarea);
    // 可以加个换行或者分隔符，让布局更清晰
    container.appendChild(document.createElement('br'));
  }
}

额外检查点 #

如果上面的方法都没用，你可以排查下：

• 页面里有没有其他代码调用了location.reload()或者类似刷新页面的逻辑
• 你的表单有没有设置action属性，导致提交后跳转

试一下这两个方案，应该就能解决textarea瞬间消失的问题啦！

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