Question

请看这个小提琴...... http://jsfiddle.net/sM8sb/1/

jQuery语法是：

$(document).on('click', 'input[name^="treated"]', function () {
    var row = $(this).closest('tr');
    calculateRow(row);
});

function calculateRow(row) {
    if ($("table.authors-list").find('input[name^="treated"]').is(':checked')) {
        var product = row.find('input[name^="product"]').val();
        alert(product + ' checked');
    } else {
        var product = row.find('input[name^="product"]').val();
        alert(product + ' unchecked');
    }

}

我想要的是，当我选中行的复选框时，它会显示该行的产品输入值以及状态“已检查”。当我取消选中它时显示相同但未经检查。

我不确定jsfiddle上jQuery的onload / ondomready选项。

任何帮助都将不胜感激。

Answer 1

Fiddle

您必须在当前行中找到复选框，而不是在整个表格中找到。

if (row.find('input[name^="treated"]').is(':checked')) {

Answer 2

在calculateRow中，您始终选择$("table.authors-list").find('input[name^="treated"]')，这将产生名称以“已处理”开头的所有输入元素。每次选中任何复选框时，您的.is都会转到已检查条件。

您需要使用类似row.find('input[name^="treated"]')的内容。或者row.find(':checkbox')，或者只是将点击监听器中的this作为输入参数传递给calculateRow（Demo）。

顺便说一句，如果您开始使用类而不是检查名称，您可能会发现代码更容易编写。 You could end up with something like this

Answer 3

没有必要找到你想要的行。您的代码将更有效，如下所示：

$(document).on('click', 'input[name^="treated"]', function () {
    calculateRow($(this));
});

function calculateRow(checkbox) {
    var product = checkbox.prev().val();
    alert(product + (checkbox.prop('checked') ? ' checked' : ' unchecked'));
}

Demo

Answer 4

试试这个

    $('input[name^="treated"]').change(function () {
        var this_checkbox = $(this);
        if (this_checkbox.is(':checked')) {
            var product = this_checkbox.closest('tr').find('input[name^="product"]').val();
            alert(product + ' checked');
        }
        else {
            var product = this_checkbox.closest('tr').find('input[name^="product"]').val();
            alert(product + ' unchecked');
        }
    });

Answer 5

这里给出的答案非常有效。这只是我对它的看法。

$(document).on('click', 'input[name^="treated"]', function () {
    var row = $(this).closest('tr');
    calculateRow(row, $(this));
});

function calculateRow(row, chkBox) {
    var checked = chkBox.is(':checked'),
        product = row.find('input[name^="product"]').val();

    alert(product + ((checked)?' checked': ' unchecked'));

}

jQuery显示行输入和复选框状态的值

5 个答案: