Доброго всем дня.
Суть: хочу, чтобы элемент radio выбирался не только по клику на "кружочке", но и по клику на картинке, которая относится к данному элементу.
Имеется следующий код:
<input type="radio" name="radioname" value="radio1"> <img src="radio1img.png" alt="radio1" id="radio1img" onclick="imgClick()" />
<input type="radio" name="radioname" value="radio2"> <img src="radio2img.png" alt="radio2" id="radio2img" onclick="imgClick()" />
<input type="radio" name="radioname" value="radio3"> <img src="radio3img.png" alt="radio3" id="radio3img" onclick="imgClick()" />
Вариант 1:
function imgClick() {
if (document.getElementById("radio1img").onclick) {
document.getElementsByName("radioname")[0].checked = true;
document.getElementsByName("radioname")[1].checked = false;
document.getElementsByName("radioname")[2].checked = false;
}
else if (document.getElementById("radio2img").onclick) {
document.getElementsByName("radioname")[1].checked = true;
document.getElementsByName("radioname")[0].checked = false;
document.getElementsByName("radioname")[2].checked = false;
}
else if (document.getElementById("radio3img").onclick) {
document.getElementsByName("radioname")[2].checked = true;
document.getElementsByName("radioname")[1].checked = false;
document.getElementsByName("radioname")[0].checked = false;
}
}
Также пробовал jQuery:
function imgClick() {
$('#radio1img').click(document.getElementsByName("radioname")[0].checked = true);
$('#radio2img').click(document.getElementsByName("radioname")[1].checked = true);
$('#radio3img').click(document.getElementsByName("radioname")[2].checked = true);
}
В обоих вариантах всегда выбирается только первый radio. Не важно, на какую картинку я кликаю, всегда выбирается только первый. Почему так?