Здравствуйте, в ЯваСкрипте я не очень шарю...
нужно сделать красивые радио переключатели выбора пола:
когда выбран мужской пол
когда выбран женский
Тут просто при выборе radio меняется фон, но у меня выбираться выбирается, а вот обратно фон не возвращается когда выбираю другой пол, получается как будто они выбраны оба.
Понимаю что нужно что то поправить в Ява скрипте, но что низнаю...
<table border='01'>
<tr>
<td>
<input id="Radio1" type="radio" class="RadioMan" name="sex" >
<label id="Label1" for="Radio1" class="man"></label>
</td>
<td>
<input id="Radio2" type="radio" class="RadioWoman" name="sex"/>
<label id="Label2" for="Radio2" class="woman"></label>
</td>
</tr>
</table>
CSS:
.RadioMan{
display: none;
}
.RadioWoman{
display: none;
}
.man{
background: url("uncheckman.png") no-repeat center;
font-family: tahoma, verdana, "sans-serif";
margin-left: 50px;
width: 50px;
height: 65px;
display: block;
float: left;
cursor: pointer;
}
.woman{
background: url("uncheckwoman.png") no-repeat center;
font-family: tahoma, verdana, "sans-serif";
margin-left: 50px;
width: 50px;
height: 65px;
display: block;
float: left;
cursor: pointer;
}
.RadioLabelClass:hover{
text-decoration: underline;
cursor: pointer;
}
.RadioSelectedMan{
background: url("checkman.png") no-repeat center;
}
.RadioSelectedWoman{
background: url("checkwoman.png") no-repeat center;
}
$(document).ready(function(){
$(".RadioMan").change(function(){
if($(this).is(":checked")){
$(".RadioSelectedMan:not(:checked)").removeClass("RadioSelectedMan");
$(this).next("label").addClass("RadioSelectedMan");
}
});
$(".RadioWoman").change(function(){
if($(this).is(":checked")){
$(".RadioSelectedWoman:not(:checked)").removeClass("RadioSelectedWoman");
$(this).next("label").addClass("RadioSelectedWoman");
}
});
});