Question

如何在数据属性中选择包含数字范围内的数字（数字不重复）的复选框。假设我有这两个复选框：

<input type="checkbox" name="A" data-numbers="1,3,2" />
<input type="checkbox" name="B" data-numbers="34,21,11,39,8,6,33" />

我希望选择数字3的复选框。

因为数字3是第一个复选框数据编号中的第二个数字，所以它应匹配并选择第一个复选框。

Answer 1

您可以过滤jQuery对象。

var num = "3";
var elem = $('[date-numbers]').filter(function(){
   return $(this).data("numbers").split(",").indexOf(num) > -1;
});

您正在做的是根据,上的拆分进行过滤，然后检查其中是否存在num。

Answer 2

这个答案使用与@ AmitJoki相同的技术，但如果你愿意接受建议，可以将一些处理转移到标记。通过将"1,3,2"更改为"[1,3,2]" .....，代码变为：

var num = 3;
$(':checkbox').filter(function() {
    return $(this).data('numbers').indexOf( num ) > -1;
})
.prop('checked', true); //or whatever other processing you'd like to perform

$(function() {
    //not required .. just for demo purposes
    $(':checkbox').after(function() {
        return $('<label/>', {text: $(this).data('numbers')});
    });

    var num = 3;
    $(':checkbox').filter(function() {
        return $(this).data('numbers').indexOf( num ) > -1;
    })
    .prop('checked', true); //or whatever other processing you'd like to perform
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="checkbox" name="A" data-numbers="[1,3,2]" />
<input type="checkbox" name="B" data-numbers="[34,21,11,39,8,6,33]" />

Answer 3

使用'data-numbers'循环遍历所有输入设置attr检查是否找到了您要定位的值的索引

$("input[data-numbers]").each(function() {
    $(this).attr("checked", $(this).attr('data-numbers').indexOf(",3,") > -1);
});

http://jsfiddle.net/Mutmatt/jfzpakru/

使用jQuery通过自定义数据属性的子字符串选择复选框

3 个答案: