Jquery - nieskończona pętla

Question

Mam stronę internetową, która ma przycisk umieszczony wewnątrz div. Co chcę osiągnąć, to gdy użytkownik kliknie element div, spowoduje to kliknięcie przycisku. Kod jest podobny do:

<div id='main'>  
<input id="button" type="button" onclick="javascript:dosomething();" value="submit" /> 
</div> 


<script type="text/javascript"> 
    $(function(){ 
    $('#main').bind('click', function(){ 
     $('#button').trigger('click'); 
    }) 
    }) 
</script> 

Po uruchomieniu (kliknij na div), spowodowałoby to błąd javascript "zbyt wiele rekursji". To ma sens, dlaczego jego nieskończona pętla istnieje, ale nie jestem pewien, co jest właściwym sposobem na osiągnięcie tego działania? (plz nie pytaj mnie, dlaczego chcę tego w ten sposób, to nie mój kod!)

dzięki za życzliwą pomoc!

Answer 1

Zatrzymaj event bubbling wewnątrz obsługi zdarzeń click button.

Zastosowanie e.stopPropagation()

Jeśli używasz jQuery następnie wykonać wszystkie procedury obsługi zdarzeń w jQuery sposób. Więc kliknij przycisk będzie

$('#button').click(function(e){ 
    doSomething(); 
    e.stopPropagation(); 
}); 

więc cała sprawa będzie

$(function(){ 
    $('#main').bind('click', function(){ 
     $('#button').trigger('click'); 
    }); 

    $('#button').click(function(e){ 
     doSomething(); 
     e.stopPropagation(); 
    }); 

}); 

Answer 2

$("#main").on('click', function (e) { 
    e.stopPropagation(); 
    $("#button")[0].click(); 
}); 

Jego praca dla mnie