slideToggle功能

Question

我需要一些幫助.toogle功能：我的問題是，我需要這個功能通過點擊兩個不同的按鈕做同樣的事情; 這是我的html代碼：

<div id="popup_prova"> 
    <div id="contentElencoProva"> 
    <span>Elenco Prove:</span> 
    <form action="responseregistrodocente" method="post"> 
    <ul id="elencoProve"> 
<li><input type="radio" name="provaSelected" value="3" checked> <span>Id prova: 3 tipo [scritto/orale]: O conoscenza: Esame</span></li> 
<li><input type="radio" name="provaSelected" value="4"> <span>Id prova: 4 tipo [scritto/orale]: O conoscenza: Esame</span></li> 
</ul><p class="submitProve"><button type="button" name="creaProva">Crea Prova</button><button type="button" name="modificaProva">Mostra/Nascondi Dettagli Prova</button> <button type="button" name="eliminaProva">Elimina Prova</button> 
</p><p class="infoVoto"><span id="info_Voto"></span> 
<span><input type="text" name="voto"></span></p> 
<p class="submitVoto"><input type="submit" name="modificaVoto" value="Modifica Voto"> <input type="submit" name="eliminaVoto" value="Elimina Voto"></p> </form> 
    </div> 
<div id="gestioneProva"> 
<span id="titleProva"></span> 
<form id="f_creaProva" action=""> 
<table> 
<tr> 
    <td>Scegli il tipo di prova: 
    <select name="s_creaProva"> 
    <option label="Scritto" value="S"></option> 
    <option label="Orale" selected value="O"></option> 
    </select> 
    </td> 
</tr> 
<tr> 
    <td>Scrivi i requisiti degli studenti [max 80 caratteri]<span id="counter1"></span></td> 
</tr> 
<tr> 
    <td colspan="2"><textarea id="requisiti" rows="4" cols="35"></textarea></td>  
</tr> 
<tr> 
    <td>Scrivi le abilit&agrave; degli studenti [max 80 caratteri]<span id="counter2"></span></td> 
</tr> 
<tr> 
<td colspan="2" ><textarea id="abilita" rows="4" cols="35"></textarea></td>  
</tr> 
<tr> 
    <td><input type="submit" value="Invia"><input type="reset" name="resettaProva" value="Cancella"></td> 
</tr> 
</table> 
</form> 
</div> 
</div> 


</div> 

</div> 

，這是我的javascript代碼：

<script type="text/javascript"> 
$(document).ready(function() { 


    //CREA PROVA VISUALIZZA IL CAMPO PER CREARE UNA NUOVA PROVA CHE ESISTE SEMPRE 

    $("button[name='creaProva']").on("click",function(event){ 
     $("input[name='resettaProva']").trigger('click'); 
     $("#titleProva").html("Creazione di una nuova Prova"); 
     $("#gestioneProva").slideToggle(); 
     event.stopPropagation(); 
    }); 
    //MODIFICA e NASCONDI LE INFORMAZIONI DI UNA PROVA 
    //.on scatena l'evento ogni qual volta esiste il pulsante in maniera dinamica anche se il pulsante non esiste ancora 
    $("button[name='modificaProva']").on("click",function(){ 
     $("#titleProva").html("Prova attualmente selezionata: <input type=\"text\" name=\"idProva\" value=\""+$("input[name='provaSelected']:checked").val()+"\"readonly>"); 
     $("#gestioneProva").slideToggle(); 
     event.stopPropagation(); 
     }); 
    $("input[name='provaSelected']").on("change",function(){ 
     $("#gestioneProva").hide(); 
     event.stopPropagation(); 
     }); 



}); 
</script> 

現在當我點擊 「creaProva」 .slidetoggle（）工作正常，並告訴我「DIV gestioneProva 「但是當我點擊按鈕modificaProva時它不起作用。

在我的CSS我也有顯示沒有隻DIV gestioneProva

THX很多關於幫助！

Answer 1

你缺少該行的事件參數：

$("button[name='modificaProva']").on("click",function(){ 

將其更改爲：

$("button[name='modificaProva']").on("click",function(event){