使用jquery选择表行，但在单击按钮时也选择行，如何防止这种情况？

在使用jQuery选择表行时，如果在单击按钮时也触发了行的选择，通常是因为事件冒泡导致的。事件冒泡是指事件从最深的节点开始，逐级向上传播到最外层的节点。为了避免这种情况，你可以阻止事件冒泡。

以下是一个示例代码，展示如何防止在单击按钮时选择表行：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Prevent Row Selection on Button Click</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <style>
        .selected {
            background-color: yellow;
        }
    </style>
</head>
<body>
    <table id="myTable">
        <tr>
            <td>Row 1</td>
            <td><button class="selectButton">Select</button></td>
        </tr>
        <tr>
            <td>Row 2</td>
            <td><button class="selectButton">Select</button></td>
        </tr>
    </table>

    <script>
        $(document).ready(function() {
            $('#myTable tr').click(function() {
                $(this).toggleClass('selected');
            });

            $('#myTable .selectButton').click(function(event) {
                event.stopPropagation(); // 阻止事件冒泡
                alert('Button clicked!');
            });
        });
    </script>
</body>
</html>

解释

HTML结构：
- 创建一个包含两行和按钮的表格。
- 每个按钮都有一个类selectButton。

CSS样式：
- 定义一个.selected类，用于在选择行时改变背景颜色。
JavaScript/jQuery：
- 使用$('#myTable tr').click(function() { ... })来选择表格行，并在点击时切换.selected类。
- 使用$('#myTable .selectButton').click(function(event) { ... })来选择按钮，并在点击时阻止事件冒泡（通过event.stopPropagation()），从而防止触发行的选择。