我在模态框内有一个 table,上面有一个按钮,单击该按钮时,它会调用一个将数据保存到 sessionStorage 的函数

I have a table inside a modal with a button on it, on the click on of that button, it calls a function which saves the data to sessionStorage

<div class="modal fade" id="defaultModalPrimary" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-body m-3">

                <table class="table table-striped table-bordered">
                    <tbody>
                        <tr>
                            <td>Type of Claim</td>
                            <td id="TypeofClaim" >Data</td>
                        </tr>
                        <tr>
                            <td>Investigation Type</td>
                            <td id="InvestigationType" >Data</td>
                        </tr>
                        <tr>
                            <td>Customer ID</td>
                            <td id="CustomerID" >Data</td>
                        </tr>
                        <tr>
                            <td>Name of LA</td>
                            <td id="NameofLA" >Data</td>
                        </tr>
                        <tr>
                            <td>Date of Birth of LA</td>
                            <td id="DateofBirthofLA" >Data</td>
                        </tr>
                        <tr>
                            <td>Age at Entry</td>
                            <td id="AgeatEntry" >Data</td>
                        </tr>
                        <tr>
                            <td>Date of Commencement</td>
                            <td id="DOC" >Data</td>
                        </tr>
                        <tr>
                            <td>Occupation of LA</td>
                            <td id="OccupationofLA" >Data</td>
                        </tr>
                    </tbody>
                </table>
                <a href="#">    
                <button id="StartInvestigationButton" type="button" onclick="startInvestigation()"  class="btn btn-primary float-right">Start Investigation</button></a>
            </div>
        </div>
    </div>
</div>
<!--end Modal -->

函数如下:

function startInvestigation(){
    console.log("Investigation Started")
    var caseDetails = new Array();
    caseDetails[0] = document.getElementById("TypeofClaim").value;
    caseDetails[1] = document.getElementById("InvestigationType").value;
    caseDetails[2] = document.getElementById("CustomerID").value;
    caseDetails[3] = document.getElementById("NameofLA").value;
    caseDetails[4] = document.getElementById("DateofBirthofLA").value;
    caseDetails[5] = document.getElementById("AgeatEntry").value;
    caseDetails[6] = document.getElementById("DOC").value;
    caseDetails[7] = document.getElementById("OccupationofLA").value;
    console.log(caseDetails);
}

控制台日志:

[undefined, undefined, undefined, undefined, undefined, undefined, undefined, undefined]

注:
我已经使用 table 完成了此操作,但现在 table 位于模态中,我不知道该怎么做。

可能是因为 table 在模态内部,td 的值无法检索并显示为未定义。

TD 没有 value(大多数 html 元素没有)

您要找的是textContent

caseDetails[0] = document.getElementById("TypeofClaim").textContent;

function startInvestigation(){
    console.log("Investigation Started")
    var caseDetails = new Array();
    caseDetails[0] = document.getElementById("TypeofClaim").innerText;
    caseDetails[1] = document.getElementById("InvestigationType").innerText;
    caseDetails[2] = document.getElementById("CustomerID").innerText;
    caseDetails[3] = document.getElementById("NameofLA").innerText;
    caseDetails[4] = document.getElementById("DateofBirthofLA").innerText;
    caseDetails[5] = document.getElementById("AgeatEntry").innerText;
    caseDetails[6] = document.getElementById("DOC").innerText;
    caseDetails[7] = document.getElementById("OccupationofLA").innerText;
    console.log(caseDetails);
}