我要做的是让用户单击一个表,该表选择该表中的单选按钮,然后将类添加到所选的表中。然后,如果用户在选中该无线电时选择另一个表,则将添加该类,但是也需要移除先前选择的表/无线电中的类。
现在大多数都有效,当我选择另一个无线电时,接受上一个类没有删除。只有当您切换收音机时才会将其删除。
Here's a link to a demo on jsfidd你可以看到所有的HTML和其他JS。
$(function() {
$('table').click(function(event) {
if (event.target.type != "radio") {
var that = $(this).find('input:radio');
that.attr('checked', !that.is(':checked'));
if (that.is(':checked')) {
that.closest('table').addClass('selected');
}
else {
that.closest('table').removeClass('selected');
}
}
});
});
我还忘了在修改它之前我正在使用另一个版本。在这个实际上,如果您实际单击单选按钮,样式将正确添加/删除,但不会在您单击表时。我试图结合这两个,那就是我如何得到我上面发布的功能..
This is the link to the jsfiddle with that demo这里也是我用过的jquery。
// jQuery to select radio button within clicked table
$(function() {
$('table').click(function(event) {
if(event.target.type != "radio") {
var that = $(this).find('input:radio');
that.attr('checked', !that.is(':checked'));
}
});
});
// jQuery to change the style of the table containing the selected radio button
$(function() {
$('input[type="radio"]').change( function() {
// grab all the radio buttons with the same name as the one just changed
var this_radio_set = $('input[name="'+$(this).attr("name")+'"]');
for (var i=0; i < this_radio_set.length;i++) {
if ( $(this_radio_set[i]).is(':checked') )
$(this_radio_set[i]).closest('table').addClass('selected');
else
$(this_radio_set[i]).closest('table').removeClass('selected');
}
});
});
答案 0 :(得分:0)
你需要做这样的事情:
$(this).closest('.container').addClass('selected').parent().siblings().each(function() {
$(this).find('.container').removeClass('selected');
});
答案 1 :(得分:0)
$(function() {
$('table').click(function(event) {
if (event.target.type != "radio") {
var that = $(this).find('input:radio');
that.attr('checked', !that.is(':checked'));
$('table.selected').removeClass('selected');
that.closest('table').addClass('selected');
}
});
});