Comment faire exécuter le code lorsque la limite est réellement atteinte

Question

J'ai cet ensemble de code qui ajoute une classe css display:none à un certain élément sur ma page. Bien que cela fonctionne, j'ai besoin du code pour appliquer le style à l'élément lorsque la valeur d'entrée est affichée. À l'heure actuelle, il applique le style après la création de l'entrée et le clic sur le bouton à nouveau. J'en ai besoin pour disparaître lors de la création de ce champ de saisie .

Des idées?

<script> 
>   var counter = 1; 
>   var limit = 15; 
>   function addInput(divName){ 
> >    if (counter == 15) {  
>     var el = document.getElementById('destroy');  
>     el.style.display = "none"; 
> >    } 
> >    else { 
> >    var newdiv = document.createElement('div'); 
> >    newdiv.innerHTML = "<span id=''>Serial Number " + (counter + 1) + " : <input type='text' name='myInputs[]'/></span>"; 
> >    document.getElementById(divName).appendChild(newdiv); 
> >    counter++; 
> >    } 
> > 
> > } </script> 

Answer 1

Je devine que vous essayez de le faire:

var counter = 1; 
var limit = 15; 
function addInput(divName){ 
    if (counter < limit) {  
    var newdiv = document.createElement('div'); 
    newdiv.innerHTML = "<span id=''>Serial Number " + (counter + 1) + " : <input type='text' name='myInputs[]'/></span>"; 
    document.getElementById(divName).appendChild(newdiv); 
    counter++; 
    if(counter === limit){ 
     var el = document.getElementById('destroy');  
     el.style.display = "none"; 
    } 
    } 
} 

Answer 2

Un réarrangement simple devrait faire l'affaire:

function addInput(divName){ 
    var newdiv = document.createElement('div'); 
    newdiv.innerHTML = "<span id=''>Serial Number " + (counter + 1) + " : <input type='text' name='myInputs[]'/></span>"; 
    document.getElementById(divName).appendChild(newdiv); 
    counter++; 
    if (counter == 15) {  
     var el = document.getElementById('destroy');  
     el.style.display = "none"; 
    } 
}