Javascript 不同的按钮应该有不同的功能

问题是，我必须创建一个每月考勤显示网页。表中记录为：日期和状态（出席、许可、值班等）。“状态”是一个按钮，点击它，我会看到一个对话框，说明原因。（例如，对于身份许可，原因可能是“不好”，对于值班，原因可能是“广告活动等”）。确切的状态和原因在数据库中，我从数据库中获取并存储在一个数组中

 out.println("         <tr>\n" +
                "            <td style = \"text-align:center\" height=\"40\"><font style=\"color: black\">"+ db.date[i] +"</font> </td>\n" +
                "            <td style = \"text-align:center\" height=\"40\"> <font style=\"color: "+colour+"\">" + "<button onclick=\"document.getElementById('id01').style.display='block'\" style=\"width:auto; -webkit-box-align: center; \"> " +db.status[i]+ " </button>  </a>" +"</font> </td>\n" +
                "         </tr>   ");
        reason = db.reason[i];
    }

out.println（“\n”+
“+db.date[i]+”\n”+
“+”+db.status[i]+“+”\n+
"            ");
原因=db.原因[i]；
}

“id01”是一个框，它应该显示信息。关键是，

date[i]

、

status[i]

和

reason[i]

具有相应的值。第i个框应包含

日期[i]

，

状态[i]

。单击

状态[i]

，将打开一个弹出框，其中应显示

原因[i]

一切都准备好了，但原因是[i]部分。在我所做的尝试中，

reason[0]

为所有按钮显示

---

请解释一种补救方法

使用for循环显示数据。像这样的东西应该有用

<table>
<tr>
    <th>Date</th>
    <th>Reason</th>
    <th>Status</th>
</tr>
<tr>
    <%
        for(int i=0;i<length_of_array;i++)
        {

    %>
    <td><%=date[i]%></td>
    <td><button onclick="alert('Reason is<%=reason[i]%>')">Click here to get Reason</button></td>
    <td><%=status[i]%></td>
    <%
        }
    %>
</tr>
</table>

日期
理由
地位
单击此处获取原因

---

检查数据库中的数据是否仍显示为零。如果仍然不起作用，请共享您的代码。

您也可以共享一些代码片段吗？这会起作用，但我要寻找的是“状态”是一个按钮，单击该按钮会显示原因。我想这就是您的意思。我编辑了这篇文章