Попытки использовать стилизованный флажок в заголовке аккордеона

Question

EDIT Я пытался установить флажок с $("#accordion input[type='checkbox']"), который не работал, потому что у меня флажок установлен в display:none; я закончил тем, что использовать вместо $("#accordion .onoffswitch"), потому что это привело к тому, что div содержал причудливую тумблерную часть причудливого тумблера.

---

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

Моя проблема заключается в том, что тумблер, похоже, не доступен для подключения.

Это трудно описать, так вот JSFiddle of my problem

в основном, мне просто нужно, чтобы получить мой тумблер, чтобы быть в состоянии изменить.

Я уже реализовать некоторые распространения Javascript так:

$(".accordion").accordion(); 
$('.accordion input[type="checkbox"]').click(function(e) { 
    e.stopPropagation(); 
}); 

Так мое дело в том, что теги H3 каким-то образом блокирует событие щелчка флажок от стрельбы.

Позволь мне знать, если вы хотите, чтобы я отправить что-нибудь еще, связанное с кодом (хотя JSFiddle в значительной степени есть все это есть.)

Answer 1

Попробуйте использовать:

$('#accordion').accordion(); 
$('#accordion .onoffswitch').click(function(e) { 
    e.stopPropagation(); 
}); 

Поскольку это только получает активируется при выборе флажка, который вы скрыли. Выберите весь «переключатель», а не скрытый флажок.

Answer 2

Что касается использования display:none; использование visibility:hidden; для флажок.