Question

我有一个脚本，当选中一个复选框时显示一个值，并且当选中多个复选框时没有显示任何值。

这是有道理的。如果我选中一个复选框，我会得到与其最近的class=list相关联的值，如果我点击第二个复选框，我什么也得不到，这是正确的。

但是，当我取消选中第二个复选框时，警报会显示其值，而不是上次检查的复选框的值。

那么我如何获得唯一复选的复选框的值？

这是复选框的布局，它距离class list

最近

<tr>
<td>1</td><td><input type='checkbox' name='id[0]' id='0'/></td>
<td class='list'><span>1234</span></td>
<td><span></span></td>
</tr>

这是我正在使用的jQuery：

$(document).ready(function () {
    var count;
    $(':checkbox').change(function() {
        count = ( $('input[type="checkbox"]:checked').length ) ;
        txt = $(this).closest('tr').find('.list').text();
        if (count == "1" ) {
            alert (txt)
        } 
    });
});

这是一个显示问题的JSFiddle：http://jsfiddle.net/f7qcuwkf/ 如果选中选项1，则警报显示1234。

如果选中选项3，则不显示任何内容（这是正确的）如果取消选中任一选项，则会看到它的值，而不是剩余的已检查条目的值。 EG：

取消选中3我得到了3456，而不是1234（仍然检查了1）

有任何想法如何解决这个问题？

由于

Answer 1

如果您使用this遍历DOM，您将获得已更改复选框的视频。您需要使用复选框遍历DOM。为此，您可以缓存选中的复选框并使用它遍历DOM。

$(document).ready(function () {
    var count;
    $(':checkbox').change(function() {
        var $checkboxes = $('input[type="checkbox"]:checked');
        count = ( $checkboxes.length ) ;

        if (count == "1" ) {
            var txt = $checkboxes.closest('tr').find('.list').text();
            alert (txt)
        } 
    });
});

http://jsfiddle.net/f7qcuwkf/5/

Answer 2

您需要以这种方式分配txt变量（查找最接近复选行的复选框，而不是找到已更改的行）：

txt = $('input[type="checkbox"]:checked').closest('tr').find('.list').text();

Demo

Answer 3

当您更改时，您将从触发的复选框中捕获文本，而不是从选中的复选框中捕获文本。

$(":checkbox:checked").closest("tr").find('.list').text()

http://jsfiddle.net/f7qcuwkf/1/

jQuery：多个复选框，获取唯一一个复选的值

3 个答案: