我对jquery非常非常新。我试图做一些最有可能对大多数大师来说都是基本的东西,但是我觉得我一直在搞乱它,我必须忽略一些非常简单的东西。
我有一个很大的复选框列表(总共85个),需要根据选择列表中选择的值进行检查。选择列表和复选框都是通过ASP页面/数据库查询动态创建的。
链接到小提琴:http://jsfiddle.net/v9p5C/21/
HTML:
<select id="roleID">
<option data-filter=''>ID</option>
<option data-filter='200'>200</option>
<option data-filter='300'>300</option>
<option data-filter='400'>400</option>
</select>
<BR>
<BR>
<input type="checkbox" data-tags='["200"]'>Create
<br>
<input type="checkbox" data-tags='["200,300"]'>Edit
<br>
<input type="checkbox" data-tags='["200","300, 400"]'>View
<br>
<input type="checkbox" data-tags='["200"]'>Delete
<br>
<input type="checkbox" data-tags='["200"]'>Archive
<br>
SCRIPT:
$(function () {
$(document).on('change', function (e) {
var filter = $(this).data('filter');
$('input[type="checkbox"]').each(function () {
var $checkbox = $(this);
var tags = $checkbox.data('tags');
$.each(tags, function () {
if (filter == this) $checkbox.prop("checked", !$checkbox.prop("checked"));
});
});
});
});
答案 0 :(得分:2)
var filter = $(this).data('filter');
行试图从select元素获取数据过滤器值,而不是选定的选项元素。以下是如何获取选择选项的数据过滤器:
var filter = $('option:selected', this).data('filter');
更新小提琴:
(小提琴中还有一些其他小错误也是固定的)
答案 1 :(得分:2)
你的jQuery需要看起来更像这样:
$(function () {
$('#roleID').on('change', function (e) {
var filter = $(this).val();
$('input[type="checkbox"]').removeAttr('checked');
$('input[type="checkbox"][data-tags*="'+filter+'"]').attr('checked','checked');
});
});
这是创建该功能的一种非常简单的方法。你可以在这里查看小提琴: