JSP中通过JS修改提交按钮值失效问题求助

核心问题定位 #

你的代码存在三个关键问题导致功能失效：

1. JavaScript函数语法错误：myFunction(str)的定义缺少function关键字，浏览器无法识别这是合法函数。
2. Bootstrap Tab切换的默认行为干扰：链接上的data-toggle="tab"会触发Tab切换逻辑，可能中断onclick事件的执行优先级。
3. 提交按钮缺少name属性：Servlet只能通过name属性获取表单参数，当前按钮仅设置id，无法被后端读取。

分步修复方案 #

1. 修正JavaScript函数定义 #

将头部脚本改为标准函数声明格式：

<script type="text/javascript">
    function myFunction(str) {
        document.getElementById("send_mess_btn").value = str;
        // 可选：打印日志确认参数是否正常传入
        console.log("按钮value已更新为：", str);
    }
</script>

2. 解决Tab切换与点击事件的冲突 #

调整动态生成的链接代码，复用已定义的param变量（避免重复查询数据库），并确保onclick事件优先执行：

<% 
    String param = acc.selectByUsername(listamit.get(l)).getUsername();
%>
<a href="#<%= param %>" onclick="myFunction('<%= param %>'); return true;" data-toggle="tab">

若上述方案仍存在冲突，可改用更可靠的事件委托方式：

• 先修改动态链接，添加自定义属性存储用户名：

<% 
    String param = acc.selectByUsername(listamit.get(l)).getUsername();
%>
<a href="#<%= param %>" data-username="<%= param %>" data-toggle="tab">

• 再替换头部脚本为事件委托逻辑：

<script type="text/javascript">
    document.addEventListener('DOMContentLoaded', function() {
        document.querySelectorAll('[data-username]').forEach(link => {
            link.addEventListener('click', function() {
                const username = this.getAttribute('data-username');
                document.getElementById("send_mess_btn").value = username;
            });
        });
    });
</script>

3. 给提交按钮添加name属性 #

修改表单中的按钮代码，补充name属性，确保Servlet能读取参数：

<button class="btn btn-default" id="send_mess_btn" name="send_mess_btn" value="" type="submit">Invia</button>

后端验证 #

修复完成后，在Servlet中通过以下代码即可获取到按钮的value值：

String targetUsername = request.getParameter("send_mess_btn");

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