fisarmonica jQueryUI con caselle di controllo

Question

Sto provando a inserire una casella di controllo in ognuna delle mie intestazioni di fisarmonica per indicare se qualcosa deve essere disattivato o meno. La casella di controllo si presenta bene, tuttavia, non è selezionabile poiché l'intera intestazione della fisarmonica è collegata al tag <a>. Mettendo la casella di controllo al di fuori del tag <a>, viene visualizzata la casella di controllo sotto l'intestazione, che non è ciò che desidero e non è ancora selezionabile.

<div id="accordion"> 
    <h3><a href="#">Text <span id="id">More text<input type="checkbox"/></span></a></h3> 
    <div>content etc</div> 
</div> 

Answer 1

È possibile utilizzare stopPropagation() per risolvere questo

example jsfiddle

qualcosa come

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

Answer 2

Prenderei il controllo di input dal collegamento ipertestuale.

<h3><a href="#">Text</a><span id="id">More text<input type="checkbox"/></span></h3> 

Answer 3

provare a impostare la casella di controllo per controllare in caso acordion click, utilizzando

<input type="checkbox" name="foo" /> 

in html e

$('input[name=foo]').attr('checked', true); 

nell'evento.

Answer 4

<input type="checkbox" onclick="event.stopPropagation()" />