php - tbody 不允许点击

Question

我很快就写好了，因为我遇到了问题。如果代码看起来很乱，我深表歉意。 tbody 是不可点击的吗？没有警报，我也没有看到任何明显的错误

相关的php

echo '<table>';
while ($row = mysql_fetch_array($result)) { 

echo
'<tbody class = "reserveAPickupAppointmentRoommateAppointment"
        id = "reserveAPickupAppointmentRoommateAppointment">
    <tr>
            <td>'
                .$row["name"].
            '</td>
            <td>
                <span class = "reserveAPickupAppointmentLocaton"
                            id="reserveAPickupAppointmentLocaton">'
                    .$row["location"].
                '</span>
            </td>
            <td>
                <span class = "reserveAPickupAppointmentSubLocaton"
                            id="reserveAPickupAppointmentSubLocaton">'
                    .$row["subLocation"].
                '</span>
            </td>
        </tr>
        <tr>
            <td>
                <span class = "reserveAPickupAppointmentStartTime"
                            id="reserveAPickupAppointmentStartTime">'
                .$row["startTime"].
            '</span>    - 
            <span class = "reserveAPickupAppointmentEndTime"
                            id="reserveAPickupAppointmentEndTime">'
            .$row["endTime"].
                '</span>
            </td>
            <td>
                <span class = "reserveAPickupAppointmentDate"
                            id="reserveAPickupAppointmentDate">'
                .$row["date"].
                '</span>
            </td>
        </tr>
    </tbody>';
}

echo '</table>';

jquery 包含在我的文档就绪函数中

   $("#reserveAPickupAppointmentRoommateAppointment").click (function() {
    alert ("TEST");
   });

Answer 1

您的 ID 与您的类(class)相符这一事实有点吓人。我不知道 php，但从 while 看来，您正在循环中创建多个 tbody。

这意味着您将拥有多个 ID 为 reserveAPickupAppointmentRoommateAppointment 的元素。如果是这样，它是无效的，并且很可能只有第一个会被选择器匹配。

直接回答你的问题，是的，tbody 可以有一个处理程序，只要你允许事件冒泡到它。

http://jsfiddle.net/hEw54/

---

不知道你的代码的其余部分，我猜你想要表格上的 ID，然后选择它下面的所有 tbody 元素。

$(document).ready(function() {
    $('#reserveAPickupAppointmentRoommateAppointment tbody').click(function() {
        alert ("TEST");
    });
});

或者您可以直接按类别选择:

$(function() {
    $('.reserveAPickupAppointmentRoommateAppointment').click(function() {
        alert ("TEST");
    });
});

---

我更新了上面的代码以放置在 jQuery DOM 就绪处理程序中。您会注意到这两个示例略有不同。它们本质上是相同的，第二个是第一个的捷径。还有其他细微差别，但这里无需关注。

另请注意，有些人将以下内容误认为是 DOM 就绪代码:

(function() {

    // I'm not a DOM ready construct

})();