jQuery HTML table 行中第二列的选择器

Question

我的代码的目的是将所选 HTML table 行中的数据添加到 JavaScript 数组，如果未选择该行则将其删除。

我现在有两个问题：

第一次单击时未应用 CSS 样式

我无法让 jQuery 选择器正确地 add/remove 数组的 table 数据。

$('table tbody tr').click(function(event) {
            if (event.target.type !== 'checkbox') {
                $(':checkbox', this).trigger('click');
            }
            $("input[type='checkbox']").change(function(e) {
                if($(this).is(":checked")){
                    $(this).closest('tr').addClass("selected_row");
                    addJob(document.getElementById('jobs'), $(this).closest('tr td:nth-child(2)').text());  
                }else{
                    $(this).closest('tr').removeClass("selected_row");
                    removeJob(document.getElementById('jobs'), $(this).closest('tr td:nth-child(2)').text());
                }
            });
        });

Whosebug 社区的智慧将不胜感激！

Answer 1

你不应该在彼此内部有两个事件。

移动这个

 $("input[type='checkbox']").not('#check_all').change(function (e) {

 });

在

之外

 $('table tbody tr').click(function(event) { 

 });

改变这个

$(this).closest('tr td:nth-child(2)').text()

至此

 $(this).parent().next().text()

演示：https://jsfiddle.net/h1636ram/9/

jQuery HTML table 行中第二列的选择器

jQuery selector for second column in HTML table row

html

javascript

css

jquery

jquery-selectors