在Apex表格中选择一组复选框(使用jQuery)

Selecting a Range of Checkboxes in an Apex Tabular Form (using jQuery)

本文关键字：一组 复选框 jQuery 使用 Apex 表格 选择      更新时间：2023-09-26

我试图在顶点表格形式中添加同时选择多个复选框的选项:

我最初想编写一些Javascript，允许使用电子表格软件直观的"标准"方式选择一系列复选框:

  1. 选择第一项
  2. 新闻,按住shift键
  3. 选择最后一项

但是为了更容易实现，我决定只使用顶点按钮(设置REQUEST)。我的代码应该选择从第一个选择到最后一个选择的所有复选框。但它就是没有，我不明白为什么。

var $firstChecked = $('input[type=checkbox]:checked').first();
var $lastChecked = $('input[type=checkbox]:checked').last();
$firstChecked.nextUntil($lastChecked, 'input[type=checkbox]').each(function () {
    $(this).prop('checked', true);
});

我几乎可以肯定我在nextUntil上做错了什么，因为

$('input[type=checkbox]:checked').prop('checked', false);

就可以了。

[JSFiddle](使用从apex复制的html代码)

  • 我的javascript代码有什么问题?
  • 是否可以对"直观的方式"与jQuery(记录shift键)?

您正在尝试获取下一个复选框，直到最后一个复选框被选中。但是根据HTML DOM结构，所有的复选框不是兄弟，因此不能使用.nextUntil()。但是它们存在于每个兄弟trs中，所以找到第一个和最后一个trs，并在它们之间的tr中勾选复选框。

Try this:

$("#myButton").click(function () {
    var $firstChecked = $('input[type=checkbox]:checked:first').closest('tr');
    var $lastChecked = $('input[type=checkbox]:checked:last').closest('tr');
    $firstChecked.nextUntil($lastChecked).find('input[type=checkbox]').prop('checked', true);
});

试试这个:-

$("#myButton").click(function () {
 var f=$("input[type=checkbox]").index($('input[type=checkbox]:checked').first());    
 var ls = $("input[type=checkbox]").index($('input[type=checkbox]:checked').last());
   for(var i=f;i<=ls;i++)
     {
       $("input[type=checkbox]").eq(i).prop('checked', true);
     }   
  });
  $("#myOtherButton").click(function () {
   $('input[type=checkbox]:checked').prop('checked', false);
  });
演示

尝试使用tr的父checkbox，

var start = $firstChecked.parents('tr');
var last = $lastChecked.parents('tr');
$(start).nextUntil(last).each(function(){
    $(':checkbox',this).prop('checked',true);
});
演示

相关文章：