Как обрабатывать элементы в верхней части интерактивной области

Question

Я создал элемент управления в стиле аккордеона и пытаюсь сделать его максимально доступным и семантическим. У меня сейчас все работает нормально, но в одном аспекте я не совсем уверен. По некоторым причинам чувствует себя немного грязным. Не совсем уверен, грязный он или нет.

Демо: http://jsfiddle.net/MygBf/

В моих аккордеонных панелях вся верхняя панель (заголовок) кликабельна. И у меня есть несколько блоков ключевых слов, справа от каждой верхней панели. Способ, которым я достиг этих блоков ключевых слов, был абсолютно позиционирующим их (что ставит их поверх ссылки). Это плохо сказывалось на создании мертвых зон, где вы больше не могли нажимать на панель. Чтобы обойти это, я просто щелкнул блоки с ключевыми словами (то же самое, что и ссылка). Это все работает, но, как я уже сказал, кажется хакерским / грязным.

Наконец, вопрос: Это хак / грязный? Если да, то есть какие-нибудь идеи для другого способа достижения ящиков с ключевыми словами, но не для создания мертвых мест в интерактивной области?

Answer 1

Это не совсем то, что вы ищете, но я бы изменил селектор на весь элемент заголовка, а не на индивидуальный выбор дочерних элементов. Это даст вам эффект, который вы ищете:

$expandos.on('click', 'header', function(event){

Демо: http://jsfiddle.net/Rm2Vn/

Answer 2

Я не уверен, что именно вы имеете в виду, но если вы не хотите, чтобы заголовок onclick запускался при нажатии на boxes, попробуйте: