jQuery, :hidden и тэг option
В jQuery имеет место одна проблема с псевдоцсс селектором :hidden - в браузерах отличных от FireFox конструкция вида
<script>
$(document).ready(function() {
$("*:hidden").remove();
});
</script>
удалит не только действительно невидимые объекты, но и все options.
Проблема кроется в текущей реализации алгоритма определения видимости:
Sizzle.selectors.filters.hidden = function(elem){
return elem.offsetWidth === 0 || elem.offsetHeight === 0;
};
Фаерфокс этот момент обрабатывает вполне корректно - в качестве габаритов option он всегда возвращает размеры отрисованного select. А вот остальные браузеры (возможно не все конечно, но основные) сплоховали - всегда возвращают 0, что и приводит jQuery в замешательство.
В принципе есть два варианта решения данной проблемы. Первый сгодится если проблемы возникают только с вашим кодом - тут можно просто изменить конструкцию селектора:
<script>
$(document).ready(function() {
$("*:hidden:not(option)").remove();
});
</script>
Хуже если эта проблема мешает работе каких-либо плагинов. Решить ее можно "подменив" селектор ":hidden", что, между прочим, совсем не сложно.
<script>
// Удалять настоящий селектор не за чем.
// Просто переименуем его в :realhidden.
jQuery.expr[':'].realhidden = jQuery.expr[':'].hidden;
// А на его место поместим наш собственный, с дополнительной проверкой
jQuery.expr[':'].hidden = function(elem) {
// Если обрабатываемый элемент это option возвращаем false
if (elem.nodeName == "OPTION") {
return false;
} else { // Если нет - передаем управление оригинальному селектору :hidden
return jQuery(elem).is(":realhidden");
}
};
$(document).ready(function() {
// Сработает функция jQuery.forceHidden и все опции останутся на месте
$("#test :hidden").remove();
});
</script>
Главное, чтобы замена селектора произошла до выполнения кода скрипта, который будет ее использовать. Скорее всего достаточно того, что он выполняется до события $(document).ready, но в некоторых случаях могут быть варианты - просто будте внимательный.
pyhoster, 26/12/2009 05:55
| Категории: Программирование | Тэги: :hidden custom selector jQuery баги |
