jquery "Регулярные" выражения в селекторах, исключение (not in), "всё кроме" -- пример кода. Скрытие части формы
Primary tabs
Задача
Переключают radio button, список "радио-кнопок" ( у нас далее он заселекчен по 'input[name=User\\[bind_type\\]]'), в зависимости от того какой вариант выбран, надо показывать сответствующий ему блок из какой-то группы (div[class*="field-med"]), в все остальные элементы в такой группе скрыть.
Хоть регуляных выражений непосредственно в селекторе в jquery пока нет, всё же можно использовать сложные селекторы, где с помощью спецсимволов можно создавать довольно гибкие условия выборки (а-ля (div[class*="field-med"]) -- где звездочка означает входение подстроки в класс).
Решение
Можно как-то так
$('input[name=User\\[bind_type\\]]').change(function(){
// сначала получим значение
var value = $( 'input[name=User\\[bind_type\\]]:checked' ).val();
var pattern = 'div.field-med' + value; // этот не скрываем
// а остальные скрываем
$('div[class*="field-med"]') // все элементы в класс которых входит подстрока field-med
.not(pattern) // исключая такие(/такой)
.hide(500); // скрываем
$(pattern).show(500);
});
Но кула лучше анимация будет выглядеть, если сделать так:
$('input[name=User\\[bind_type\\]]').change(function(){
// сначала получим значение
var value = $( 'input[name=User\\[bind_type\\]]:checked' ).val();
var pattern = 'div.field-med' + value; // этот не скрываем
var time = 900; // время анимации в милисекундах
// сначала скрываем всё лишнее
$('div[class*="field-med"]') // все элементы в класс которых входит подстрока field-med
.not(pattern) // исключая такие(/такой)
.slideUp(time,
function() {
$(pattern).slideDown(time); // показываем
}
);// скрываем
});
Тут полезно почитать про:
- Сложные селекторы: http://api.jquery.com/category/selectors/
- Log in to post comments
- 4809 reads