I have some jQuery that sets an image as a radio button for a star rating system. I wish to include a function that when the user cicks a radio button the image changes to checked and the previous radios are also change to checked.
I have managed to change the class of the checked button and I have some code that would change the class on the previous buttons also, but on a simpler div structure. I have been able to combine the both.
The code to change the class for the radio button
$(function() {
$('input:radio').each(function() {
$(this).hide();
$('').insertAfter(this);
});
$('.radio-fx').live('click',function(e) {
e.preventDefault();
$check = $(this).prev('input');
var unique = '.'+this.className.split(' ')[1]+' div';
$(unique).attr('class', 'radio');
$(this).find('div').attr('class', 'radio-checked');
$check.attr('checked', true);
});
});
**html:**
Code that I tried to integrate to set previous ones to checked on hover:
$('.radio-fx').hover(
// Handles the mouseover
function() {
$(this).prevAll().andSelf().addClass('radio-checked');
$(this).nextAll().removeClass('radio');
},
// Handles the mouseout
function() {
$(this).prevAll().andSelf().removeClass('radio');
}
);
Thanks for any help.
以上就是jquery set previous div class的详细内容,更多请关注web前端其它相关文章!