jquery / javascript для пользователя, чтобы выбрать 1 из n изображений
Я хочу отобразить несколько изображений (возможно, максимум 5) и сделать так, чтобы пользователь щелкнул их. Первым делом я попробовал переключатели и вставил изображения в метки.
<input type="radio" name="BackgroundId" id="BackgroundId" value="1" />
<label for="BackgroundId"><img src="../../Content/images/thumb_1.jpg" /></label>
Firefox выбирает переключатель, когда пользователь нажимает на изображение, а IE - нет.
Есть ли плагин jquery, который сделает изображения кликабельными? Fancy-форма выглядит как то, что я мог бы использовать, но это не jquery, и у меня уже есть jquery в моем проекте.
Или кто-то может указать мне лучший способ выбора одного изображения?
2 ответа
Что-то вроде
$(function(){
$("label img").click(function(){
var parent = $(this).parent();
$("#" + parent.attr("for")).attr("checked", "checked");
});
});
Просто поместите этот javascript на свою страницу. Я проверил это.
<script language="javascript" type="text/javascript">
$(document).ready(
function ()
{
var selImg = $("#BackgroundId").next("label").find("img");
selImg.click(
function ()
{
$("#BackgroundId")[0].click();
});
});
</script>
Код читает: Получить все следующие элементы после тех элементов, которые имеют id='BackgroundId'. Теперь найдите элемент img внутри каждого. Установите события щелчка, если каждый найденный img вызывает функцию, которая будет имитировать щелчок по всем тем элементам, которые имеют id='BackgroundId'.
Обратите внимание, что, хотя я пишу "все эти" и "каждый тег", поскольку существует только один тег с идентификатором "BackgroundId", все это происходит по-отдельности.