Javascript 按钮在表行中不起作用

Javascript 按钮在表行中不起作用,javascript,jquery,html,Javascript,Jquery,Html,我有一个类似这样的HTML文件。在这个html中,tr的数量是不确定的。可能是1或1000。每行都有一个按钮,其名称为“应用”。我有一个jquery来处理单击操作,但在本例中,jquery只识别第一行的按钮。但是我不知道怎么做 <tr id="jobs" th:each="job : ${job}"> <p id="jobID" th:text="${job.jobId}" style="display: none"></p

我有一个类似这样的HTML文件。在这个html中,tr的数量是不确定的。可能是1或1000。每行都有一个按钮,其名称为“应用”。我有一个jquery来处理单击操作,但在本例中,jquery只识别第一行的按钮。但是我不知道怎么做

<tr id="jobs" th:each="job : ${job}">

                    <p id="jobID" th:text="${job.jobId}" style="display: none"></p>
                    <div class="col-md-3" id="JobTitle">
                        <span class="label label-default">Job Title</span>
                        <td th:text="${job.jobTitle}" />
                    </div>

                    <div class="col-md-3" id="jobDescription">
                        <span class="label label-primary">Job Description</span>
                        <td th:text="${job.jobDescription}" />
                    </div>

                    <div class="col-md-3" id="numberOfPersonToHire">
                        <span class="label label-success">Number Of Candidates</span>
                        <td th:text="${job.numberOfPersonToHire}" />
                    </div>

                    <div class="col-md-2" id="lastApplicationDate">
                        <span class="label label-info">Last Date</span>
                        <td th:text="${job.lastApplicationDate}" />
                    </div>

                    <button id="apply" type="submit" class="btn btn-xs"aria-label="Left Align">
                        <img th:src="@{/images/apply.png}" height="20" width="auto" />
                        Apply
                    </button>
                </tr>
id(使用#声明)是唯一的元素,不能多次使用。JavaScript用该特定id标识第一个元素,之后不再继续。您可能需要考虑使用一个类:

...
<button class="apply" type="submit" class="btn btn-xs"aria-label="Left Align">
    <img th:src="@{/images/apply.png}" height="20" width="auto" />
    Apply
</button>
...

您的
#jobId
也是如此,它不能被多次使用,因此您不能在每个循环中使用赋值。您还可以在for循环中包含一个计数器,您可以将其附加到id中,这样您就可以得到类似于
或类似的结果。但是,您必须使用选择器来查找每个
元素的每个
子元素。

是的,现在我正在用类进行尝试。谢谢,等一下
...
<button class="apply" type="submit" class="btn btn-xs"aria-label="Left Align">
    <img th:src="@{/images/apply.png}" height="20" width="auto" />
    Apply
</button>
...
$('.apply').each(function() {
    ...
});