查找已选中复选框的顺序

2024-03-26

我正在尝试获取已选中的复选框的顺序。

<ul class="dropdown-content checkboxes">
  <li><label><input type="checkbox" />Billy</label></li>
  <li><label><input type="checkbox" />Jacob</label></li>
  <li><label><input type="checkbox" />Bob</label></li>
  <li><label><input type="checkbox" />Alexandren</label></li>
  <li><label><input type="checkbox" />Erren</label></li>
  <li><label><input type="checkbox" />Stewgart</label></li>
  <li><label><input type="checkbox" />Jillian</label></li>
  <li><label><input type="checkbox" />Other</label></li>
</ul>

我想出了这个,但我无法获得选中复选框的顺序。我只能获取仅检查的列表。

$(":checkbox").click(function() {
    console.log($(":checked").length);
    var i = 0;
    checked = true;
    $(':checkbox').each(function() {
        if (this.checked == false) {
            i++;
            if (i === 8) {
                checked = false;
            }
        }
    });
});

我如何获得检查顺序的数据?例如“按此顺序选中复选框 1, 6, 3 ,2”


您将跟踪选中的复选框,例如在数组中

var order = [];

$("[type=checkbox]").on('change', function() { // always use change event
    var idx = order.indexOf(this);
	
    if (idx !== -1) {         // if already in array
    	order.splice(idx, 1); // make sure we remove it
    }

    if (this.checked) {    // if checked
    	order.push(this);  // add to end of array
    }
    
    // <------------------------------------For demonstration
    $('#result').html(JSON.stringify($.map(order, function(elem) {
    	return $(elem).closest('label').text().trim();
    })));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="dropdown-content checkboxes">
  <li><label><input type="checkbox" />Billy</label></li>
  <li><label><input type="checkbox" />Jacob</label></li>
  <li><label><input type="checkbox" />Bob</label></li>
  <li><label><input type="checkbox" />Alexandren</label></li>
  <li><label><input type="checkbox" />Erren</label></li>
  <li><label><input type="checkbox" />Stewgart</label></li>
  <li><label><input type="checkbox" />Jillian</label></li>
  <li><label><input type="checkbox" />Other</label></li>
</ul>
<div id="result"></div>

要获取每个复选框的索引,或更准确地说是父 LI,您只需映射它们即可

var map = $.map(order, function(elem) {
    return $(elem).closest('li').index();
});

FIDDLE https://jsfiddle.net/3oznqqLf/1/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

查找已选中复选框的顺序 的相关文章

随机推荐

  • 单击在 Listitem Listview android 上不起作用

    我实现了安卓listview与ListActivity 这里我遇到的问题是 当我单击列表项时 当闪烁颜色也没有出现 即橙色 时 不会执行任何操作 那么您对我的问题的友好回答有什么想法吗 Override protected void onL
  • Bootstrap Modal 与 Chart.js 折线图

    我有一个推特Bootstrap 3 模态 http getbootstrap com javascript modals窗口 我想画一个Chart js https github com nnnick Chart js里面的折线图 但每次我
  • Android Renderscript 高级 rsForEach 调用的文档

    我有一个关于带有 rs script call t 参数的 Android Renderscript rsForEach 函数如何工作的问题 在示例中 仅使用另一个 简单的 rsForEach 函数 因此这对我没有帮助 我想更改数组的 xS
  • Flask - 对 POST 的响应 - 令人困惑的行为

    我对 Flask 中的以下行为感到完全困惑 我确信发生了一些基本的事情 但我不知道这是脚本还是服务器问题 所以我发布了我能想到的最短的示例 该页面有两种方式将数据发布到服务器 一种是通过提交
  • Xcode打印字典的键和值

    Xcode 7 中的打印描述给出了类似于下面的内存地址 尝试了所有选项 但得到这样的输出 3 elements 0 2 elements 0 Output 1 3 elements 0 2 elements 0 type 1 Output2
  • c++ less 运算符重载,使用哪种方式?

    例如 在 C 头文件中 如果我定义了struct Record我想用它进行可能的排序 以便我想重载less operator 以下是我在各种代码中注意到的三种方法 我粗略地注意到 如果我要放Record into a std set map
  • Android maxLines 和 minLines 属性在 XML 中不起作用

    我有一个 XML 文件 其中包含EditText具有这些属性
  • 验证设计模式

    我正在为我们的一个部门编写一个数据验证实用程序 它有以下要求 动态添加新的业务实体 动态地向实体添加新的验证 用于显示业务实体列表及其验证的 UI 用户可以选择开始对所有或选定的业务实体进行验证 如果任何验证失败 UI 将显示验证错误消息
  • 如果应用了 java 插件,Gradle 无法在复合构建中找到 zip 工件

    我有一个 Gradle 项目 它创建一个 zip 工件 我通过定义工件artifacts add default zipTask 我通过以下方式将此项目添加到另一个项目includeBuild并使用 zip 作为依赖项 dependenci
  • 阻止用户将BMP、TIFF等图像上传到Plone中的ImageField

    用户这样做是因为他们可以 但是 图像自动调整大小等功能会出现故障 这让我成为一个悲伤的男孩 如何限制全站图像上传为 GIF PNG 和 JPEG 对于原型 为了灵巧 使用原型 您可以覆盖图像内容类或使用以下架构创建您自己的自定义图像内容类
  • emacs 智能感知

    我知道这个问题已经讨论过很多次了 但是 emacs 中的 c c intellisense 有什么好的方法吗 我一直无法正确设置 cedet 现在我正在开发一个具有庞大代码库的维护项目 如果没有适当的智能感知 管理起来非常困难 目前我正在使
  • 在每个向量条目处求和到向量末尾

    I have X lt c 1 2 3 4 5 6 我想要 X 之和的输出为 Y lt c 21 20 18 15 11 6 我继续读下去rollapply但它一次只能求和 3 个连续的数字 所以有人可以帮助我吗 你需要cumsum Try
  • 将 Console.WriteLine() 输出重定向到字符串

    我需要采取Console WriteLine 输出 并附加到字符串 我无法更改 Main 方法以简单地附加到字符串而不是写入控制台 我需要一种方法来从控制台读取所有写入的行并将它们附加到字符串 目前 我一直在使用FileStream并将控制
  • Android,有没有参考资料可以查看Android默认图标和图像是什么?

    当我想要设计 UI 时 我需要知道什么是预定义图标 我搜索了网络包括http developer android com design index html http developer android com design index h
  • 调整 coord_pol() 直方图中文本标签的位置

    我陷入了一个小标签问题 即用 ggplot2 制作的一系列极坐标直方图 圆环 这些东西怎么称呼 以下是数据和图表外观的简化示例 df lt data frame Attribute1 10 Attribute2 1 Attribute3 2
  • 如何修复 pip install 产生的 gcc 错误?

    我尝试使用以下命令从 PyPI 安装 python 包 sudo pip3 install switcheo 安装失败并显示以下错误消息 gcc Wno unused result Wsign compare Wunreachable co
  • 如何在 JavaScript 中获取查询字符串值?

    这个问题的答案是社区努力 help privileges edit community wiki 编辑现有答案以改进这篇文章 目前不接受新的答案或互动 有没有一种无插件的检索方式请求参数 http en wikipedia org wiki
  • 在 BottomSheetDialog 内的 Viewpager 内嵌套滚动

    简洁版本 我该如何设置NestedScrollingChild of a NestedScrollingParent有多个这样的孩子 长版 我实现了一个BottomSheetDialogFragment其布局由ViewPager 这个vie
  • Delphi 窗口在自定义拖动后失去焦点

    我有这段代码 当我拖动时可以移动我的主窗口MyThingThatDragsIt procedure TMainForm ApplicationMessage var Msg TMsg var Handled Boolean var Scre
  • 查找已选中复选框的顺序

    我正在尝试获取已选中的复选框的顺序 ul class dropdown content checkboxes li li ul