Javascript 如何使用jquery使复选框（3）一键选中

我这里有很多复选框

比如说，如果我点击了任何复选框，我希望选中下两个复选框（即，在两个复选框旁边）

谁能帮我一下吗

提前谢谢。

试试这个

我在每个

tr

$('button').on('click', function () {
    $(this).parents('tr').find('td>input[type=checkbox]').each(function (i, j) {
        if (i == 3) {
            return false;
        }
        $(this).prop('checked', true);
    })
})

或者试试这个

var len = 2;
var selector = 'input:checkbox'; 
$(selector).click(function(){
    var e = $(selector).index(this);   
    $(selector+':lt('+(e+len+1)+'):gt('+e+')')
       .attr('checked', 'checked');    
});

香草JS解决方案：

var checkboxes = document.querySelectorAll('input[type="checkbox"]');
for(var i=0,iLen=checkboxes.length; i<iLen; i++){
    (function(i){
        checkboxes[i].addEventListener('click',function(){
            checkboxes[(i+1)%checkboxes.length].checked = true;
            checkboxes[(i+2)%checkboxes.length].checked = true;
        })
    }(i))
}

var checkbox=document.querySelectorAll（'input[type=“checkbox”]”）；
对于（var i=0，iLen=checkbox.length；i另一个使用jquery的解决方案：

    $('input').on('click', function () {
        var count=0;
        $.each($(this).parents('tr').find('td>input[type=checkbox]'), function( index, value ) {
        if($(value).is(":checked")){
            count++;
        } else if(count > 0 && count <= 2){
            $(value).attr('checked', true);
            count++;
        }
        });
    })        

$（'input'）。在（'click'，函数（）{
var计数=0；
$.each（$（this）.parents（'tr'）.find（'td>input[type=checkbox]）、函数（索引、值）{
如果（$（值）.is（“：选中”））{
计数++；
}否则如果（计数>0&&count尝试使用
nextAll（）
和
eq
选择下两个

$('input:checkbox').change(function(){
  var obj=$(this).parent().nextAll(':eq(0),:eq(1)'); //eq(0) and (1) is the index of next two checkbox
  obj.find(':checkbox').prop('checked',this.checked)
});


如果未选中，则取消选中复选框。
尝试此工作脚本

    $('input[type="checkbox"]').click(function(obj){
       if( $(this).is(':checked')) {  
             $(this).parent().nextAll().has(":checkbox").eq(0).find(":checkbox").attr('checked','checked');
             $(this).parent().nextAll().has(":checkbox").eq(1).find(":checkbox").attr('checked','checked');

     }else{

            $(this).parent().nextAll().has(":checkbox").eq(0).find(":checkbox").removeAttr('checked');
             $(this).parent().nextAll().has(":checkbox").eq(1).find(":checkbox").removeAttr('checked');
            }                                 
    });

另一种方法。不使用DOM，而是使用输入元素数组

$('button').on('click', function () {
    $(this).parents('tr').find('td>input[type=checkbox]').each(function (i, j) {
        if (i == 3) {
            return false;
        }
        $(this).prop('checked', true);
    })
})

也适用于第一个和最后一个元素（您没有指定是否需要）


$（'input'）。更改（函数（）{
var i=$.inArray（这个，$（'input'））；
var n=i+1；
var p=i-1；
如果（n>=$（'input'）.length）n=0；
如果（p<0）p=$（'input'）。长度-1；
$（'input'）.eq（n）.attr（“选中的”），$（this.attr（'checked'）？true:false）；
$（'input'）.eq（p）.attr（“选中的”），$（this.attr（'checked'）？true:false）；
});
试试这个，它有你想要的切换效果

以下是脚本：

$(':checkbox').click(function () {
  if ($(this).is(":checked")) {
     $(this).parent().nextAll("td").slice(0, 2).find(":checkbox").prop('checked', true);
  } 
  else {
     $(this).parent().nextAll("td").slice(0, 2).find(":checkbox").prop('checked', false);
  }
});

以下是有效的
Naresh：请包括一些尝试的解决方案，为什么它们不起作用，以及预期的结果。顺序是什么？从左到右？如果单击了行中的最后一个复选框，或者只是单击了最后一个复选框，会发生什么？如果其中一个复选框已经选中，它是否应该取消选中？@NareshKamireddy您认为programming是关于谷歌搜索和复制代码？编程是关于学习如何使用这些工具，并根据这种理解自己提出解决方案。@NareshKamireddy，你5个月前就已经问过这个问题了。
。你认为你对jQuery还是新手吗？：）添加答案的想法很容易理解，但如果我这样做，专家的建议将无效，现在不会添加答案。@Murali Good observation这会检查行中的所有框，而不仅仅是后面两个框。此外，它应该使用
.prop（）
，而不是
.attr（）
。我不想用任何按钮触发，应该在单击复选框时触发。我是说chengeevent@Barmar我已经更新了我的答案。谢谢你指出
prop
，现在它只检查行中的前3个框，而不是他单击后的两个框。@NareshKamireddy实际上我想到了使用复选框att已使用更改事件处理程序设置。但为了给出一个简化的示例，这将很容易开始。您忘记在Fiddle中添加脚本。您是否认真对待循环中的单击事件？？（这是不必要的）…您的选择器应为
$（':checkbox'）。单击（函数（）{…}）
@Aitem如果我单击了一行的最后一个复选框，则无需为下两个复选框打勾checkboxes@bipen你说得对。我只是用它来获取点击项目的索引，它可以像这样运行（编辑答案）如果我点击了三个复选框中的任何一个，那么这三个都应该取消选中。我想也取消选中。这不是你在问题中说的。很明显，如何修改我的答案来做你想做的事情？Barmer想到了勾选相邻的复选框并取消选中alreadBipen中的y复选框。
$('input').change(function () {
    var i = $.inArray(this, $('input'));
    var n = i + 1;
    var p = i - 1;
    if (n >= $('input').length) n = 0;
    if (p < 0) p = $('input').length - 1;
    $('input').eq(n).attr("checked", $(this).attr('checked') ? true : false);
    $('input').eq(p).attr("checked", $(this).attr('checked') ? true : false);
});

$(':checkbox').click(function(){
    $(this).parent().nextAll().slice(0,2).find(":checkbox").attr('checked',this.checked)
})

$(':checkbox').click(function () {
  if ($(this).is(":checked")) {
     $(this).parent().nextAll("td").slice(0, 2).find(":checkbox").prop('checked', true);
  } 
  else {
     $(this).parent().nextAll("td").slice(0, 2).find(":checkbox").prop('checked', false);
  }
});