0
Я хочу показать несколько текстовых полей при щелчке переключателя, как я могу это сделать? без JavaScript или AJAX.Выбор радиокнопки
A
ответ
1
Для этого вы должны использовать JavaScript.
0
Единственное, что кроме JavaScript, что может работы (я не пробовал, но это что-то для расследования) заключается в использовании :focus pseudo class в CSS. Даже если он работает, вероятно, это не будет перекрестный браузер, но, поскольку вы ориентируетесь на определенные мобильные платформы, это может быть хорошо. Она будет работать следующим образом:
<style>
#bar { display:none; }
#foo:selected #bar { display:block; }
</style>
<input type="radio" id="foo">
<label for="foo"><div id="bar">Stuff goes here</div></label>
Я не знаю, если: в центре внимания также относится и к связанной метке элемента формы, но это, конечно, может, учитывая, что нажав ЭТИКЕТКУ элемента делает активировать «щелчок» событие на форме элемент его маркировки.
Что-то попробовать в любом случае. Если вы настроите мобильный Safari, который должен иметь хорошую поддержку для этих селекторов.
+0
Почему бы не попробовать '#foo: focus + label {display: block; } ' –
+0
Я не могу воспроизвести тот же. У меня есть переключатель на выбор, я должен показать текстовое поле. – sarah
0
Да, вы можете сделать это с помощью селектора psudo-class, но он, безусловно, не будет работать с перекрестным браузером. Вы можете проверить:
для списка какой браузер поддержки каких селекторов. IE 7 и ниже НЕ поддерживают селектор: focus, хотя вы можете выполнить примерно то, что хотите: наведите курсор (хотя я думаю, вы не хотите, чтобы он показывался только при наведении).
Следующий пример работает в Firefox (3.5):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
<head>
<style>
input { float: left; }
/* Make the text hidden when the page loads */
.text_to_show { display:none; }
/* This style affects element which immediately follows the focused class */
.trigger:focus + div.text_to_show { display: inline; }
</style>
</head>
<body>
<input type="radio" name="radio" class="trigger" />
<div class="text_to_show">This text is tied to the first radio button.</div>
<input type="radio" name="radio" class="trigger" />
<div class="text_to_show">This text is tied to the 2nd radio button</div>
</body>
</html>
там is'nt любой другой идти? – sarah
Нет, боюсь. Кстати, почему вы ограничиваете себя? Это какая-то домашняя работа? –
Я делаю мобильное приложение, где я не должен использовать java-скрипт – sarah