遺漏的類型錯誤：不能設置爲空的特性「的innerHTML」

-1

遺漏的類型錯誤：無法設置innerHTML屬性空遺漏的類型錯誤的：不能設置爲null 遺漏的類型錯誤的innerHTML屬性：不能設置爲null 遺漏的類型錯誤的innerHTML屬性：無法設置屬性空遺漏的類型錯誤的innerHTML的：不能設置innerHTML屬性空的遺漏的類型錯誤：不能設置爲空的特性「的innerHTML」

(function(){ 
 
    "use strict"; 
 
    
 
    var regalo = document.getElementById('regalo'); 
 
    
 
    document.addEventListener('DOMContentLoaded', function(){ 
 
     
 
     
 
    //campos de usuario 
 
     var nombres = document.getElementById(nombre); 
 
     var apellido = document.getElementById('apellido'); 
 
     var email = document.getElementById('email'); 
 
     
 
     
 
     
 
    //campos pases 
 
     
 
     var pase_dia = document.getElementById('pase_dia'); 
 
     var pase_completo = document.getElementById('pase_completo'); 
 
     var pase_dosdias = document.getElementById('pase_dosdias'); 
 
     
 
     
 
    //botones y divs 
 
     
 
     
 
     var calcular = document.getElementById('calcular');   
 
     var errorDiv = document.getElementById('error');   
 
     var botonRegistro = document.getElementById('btnregistro');   
 
     var lista_productos = document.getElementById('lista-productoss');  
 
     
 
     
 
     
 
    //extras 
 
     
 
     var camisas = document.getElementById('camisa_evento'); 
 
     var etiquetas = document.getElementById('etiquetas'); 
 
     
 
     
 
     calcular.addEventListener('click', calcularMontos); 
 
     
 
     function calcularMontos(event){ 
 
      event.preventDefault(); 
 
      if(regalo.value === ''){ 
 
       alert("Debes elegir un regalo"); 
 
       regalo.focus(); 
 
      }else { 
 
       var boletosDia = pase_dia.value, 
 
        boletosdosDias = pase_dosdias.value, 
 
        boletoCompleto = pase_completo.value, 
 
        cantCamisas = camisas.value, 
 
        cantEtiquetas = etiquetas.value; 
 
       
 
       var totalPagar = (boletosDia * 30) + (boletosdosDias * 45) + (boletoCompleto * 50) + ((cantCamisas * 10)*.93) + (cantEtiquetas * 2) ; 
 
       
 
       var listadoProductos = []; 
 
       
 
       if (boletosDia >= 1){ 
 
        listadoProductos.push(boletosDia + ' Pases por Dia'); 
 
       } 
 
       
 
       if (boletosdosDias >= 1){ 
 
        listadoProductos.push(boletosdosDias + ' Pases por 2 Dias'); 
 
       } 
 
       
 
       if (boletoCompleto >= 1){ 
 
        listadoProductos.push(boletoCompleto + ' Pases Completos'); 
 
       } 
 
       
 
       if (cantCamisas >= 1){ 
 
        listadoProductos.push(cantCamisas + ' Camisas'); 
 
       } 
 
       
 
       if (cantEtiquetas >= 1){ 
 
        listadoProductos.push(cantEtiquetas + ' Etiquetas'); 
 
       } 
 
       
 
       
 
       
 
       lista_productos.innerHTML= ''; 
 
       
 
       for (var i = 0; i< listadoProductos.length; i++){ 
 
        lista_productos.innerHTML += listadoProductos[i] + '<br/>'; 
 
       } 
 
      } 
 
      
 
     } 
 
     
 
    });//DOM CONTENT LOADED 
 
})();

(function(){ 
 
    "use strict"; 
 
    
 
    var regalo = document.getElementById('regalo'); 
 
    
 
    document.addEventListener('DOMContentLoaded', function(){ 
 
     
 
     
 
    //campos de usuario 
 
     var nombres = document.getElementById(nombre); 
 
     var apellido = document.getElementById('apellido'); 
 
     var email = document.getElementById('email'); 
 
     
 
     
 
     
 
    //campos pases 
 
     
 
     var pase_dia = document.getElementById('pase_dia'); 
 
     var pase_completo = document.getElementById('pase_completo'); 
 
     var pase_dosdias = document.getElementById('pase_dosdias'); 
 
     
 
     
 
    //botones y divs 
 
     
 
     
 
     var calcular = document.getElementById('calcular');   
 
     var errorDiv = document.getElementById('error');   
 
     var botonRegistro = document.getElementById('btnregistro');   
 
     var lista_productos = document.getElementById('lista-productoss');  
 
     
 
     
 
     
 
    //extras 
 
     
 
     var camisas = document.getElementById('camisa_evento'); 
 
     var etiquetas = document.getElementById('etiquetas'); 
 
     
 
     
 
     calcular.addEventListener('click', calcularMontos); 
 
     
 
     function calcularMontos(event){ 
 
      event.preventDefault(); 
 
      if(regalo.value === ''){ 
 
       alert("Debes elegir un regalo"); 
 
       regalo.focus(); 
 
      }else { 
 
       var boletosDia = pase_dia.value, 
 
        boletosdosDias = pase_dosdias.value, 
 
        boletoCompleto = pase_completo.value, 
 
        cantCamisas = camisas.value, 
 
        cantEtiquetas = etiquetas.value; 
 
       
 
       var totalPagar = (boletosDia * 30) + (boletosdosDias * 45) + (boletoCompleto * 50) + ((cantCamisas * 10)*.93) + (cantEtiquetas * 2) ; 
 
       
 
       var listadoProductos = []; 
 
       
 
       if (boletosDia >= 1){ 
 
        listadoProductos.push(boletosDia + ' Pases por Dia'); 
 
       } 
 
       
 
       if (boletosdosDias >= 1){ 
 
        listadoProductos.push(boletosdosDias + ' Pases por 2 Dias'); 
 
       } 
 
       
 
       if (boletoCompleto >= 1){ 
 
        listadoProductos.push(boletoCompleto + ' Pases Completos'); 
 
       } 
 
       
 
       if (cantCamisas >= 1){ 
 
        listadoProductos.push(cantCamisas + ' Camisas'); 
 
       } 
 
       
 
       if (cantEtiquetas >= 1){ 
 
        listadoProductos.push(cantEtiquetas + ' Etiquetas'); 
 
       } 
 
       
 
       
 
       
 
       lista_productos.innerHTML= ''; 
 
       
 
       for (var i = 0; i< listadoProductos.length; i++){ 
 
        lista_productos.innerHTML += listadoProductos[i] + '<br/>'; 
 
       } 
 
      } 
 
      
 
     } 
 
     
 
    });//DOM CONTENT LOADED 
 
})();

<section class="seccion contenedor"> 
 
     <h2>Registro de usuarios</h2> 
 
     <form action="#" method="post" id="registro" class="registro"> 
 
      <div id="datos-usuarios" class="registro caja clearfix"> 
 
       <div class="campo"> 
 
        <label for="nombre">Nombre</label> 
 
        <input type="text" id="nombre" name="nombre" placeholder="Tu Nombre"> 
 
       </div> 
 

 
       <div class="campo"> 
 
        <label for="apellido">Apellido</label> 
 
        <input type="text" id="apellido" name="apellido" placeholder="Tu Apellido"> 
 
       </div> 
 
       <div class="campo"> 
 
        <label for="email">Email</label> 
 
        <input type="text" id="email" name="email" placeholder="Tu Email"> 
 
       </div> 
 
       <div id="error"> 
 
       
 
       </div> 
 
      </div> 
 
      <!--#Datos-usuarios--> 
 

 
      <div id="paquetes" class="paquetes"> 
 
       <h3>Elige el numero de boletos</h3> 
 

 
       <ul class="lista-precios clearfix"> 
 
        <li> 
 
         <div class="tabla-precio"> 
 
          <h3>Pase por dia (viernes)</h3> 
 
          <p class="numero">$30</p> 
 
          <ul> 
 
           <li>Bocadillos gratis</li> 
 
           <li>Todas las conferencias</li> 
 
           <li>Todos los talleres</li> 
 
          </ul> 
 

 
          <div class="orden"> 
 
           <label for="pase-dia">Boletos deseados:</label> 
 
           <input type="number" min="0" id="pase_dia" sixe="3" placeholder="0"> 
 
          </div> 
 

 
         </div> 
 
        </li> 
 
        <li> 
 
         <div class="tabla-precio"> 
 
          <h3>Todos los Dias</h3> 
 
          <p class="numero">$50</p> 
 
          <ul> 
 
           <li>Bocadillos gratis</li> 
 
           <li>Todas las conferencias</li> 
 
           <li>Todos los talleres</li> 
 
          </ul> 
 
          <div class="orden"> 
 
           <label for="pase-completo">Boletos deseados:</label> 
 
           <input type="number" min="0" id="pase_completo" sixe="3" placeholder="0"> 
 
          </div> 
 

 
         </div> 
 
        </li> 
 
        <li> 
 
         <div class="tabla-precio"> 
 
          <h3>Pase por 2 dias (viernes y sabado)</h3> 
 
          <p class="numero">$45</p> 
 
          <ul> 
 
           <li>Bocadillos gratis</li> 
 
           <li>Todas las conferencias</li> 
 
           <li>Todos los talleres</li> 
 
          </ul> 
 
          <label for="pase-dosdias">Boletos deseados:</label> 
 
          <input type="number" min="0" id="pase_dosdias" sixe="3" placeholder="0"> 
 

 
         </div> 
 
        </li> 
 
       </ul> 
 
      </div> 
 
      <!--#paquetes--> 
 
      
 
      
 
      
 
      <div id="resumen" class="resumen"> 
 
       <h3>pago y extras</h3> 
 
       <div class="caja clearfix"> 
 
        <div class="extras"> 
 
         
 
         <div class="orden"> 
 
          <label for="camisa_evento">Camisa del evento $10 <small>(promoción 7% de dto.)</small></label> 
 
          <input type="number" min="0" id="camisa_evento" size="3" placeholder="0"> 
 
         </div><!--.orden--> 
 
         
 
         <div class="orden"> 
 
          <label for="etiquetas">paquete de 10 etiquetas $2 <small>(HTML5, CSS3, JavaScript, Chrome)</small></label> 
 
          <input type="number" min="0" id="etiquetas" size="3" placeholder="0"> 
 
         </div><!--.orden--> 
 
         
 
         <div class="orden"> 
 
          <label for="regalo">seleccione un regalo</label><br> 
 
          <select id="regalo" required> 
 
           <option value="">-- Seleccione un regalo --</option> 
 
           <option value="ETI">Etiquetas</option> 
 
           <option value="PUL">Pulseras</option> 
 
           <option value="PLU">Plumas</option> 
 
          </select> 
 
          
 
         </div><!--.orden--> 
 
         
 
         <input type="button" id="calcular" class="boton" value="calcular"> 
 
         
 
        </div><!--.extras--> 
 
        
 
        <div class="total"> 
 
         <p>Resumen</p> 
 
         <div class="lista-productos"> 
 
          
 
         </div> 
 
         <p>Total</p> 
 
         <div id="suma-total"> 
 
          
 
         </div> 
 
         <input type="submit" id="btnregistro" class="boton" value="Pagar"> 
 
        </div><!--.Total--> 
 
       </div><!--.Caja--> 
 
      </div><!--.Resumen-->

來源

2017-05-25 jefferson

變化'變種lista_productos =的document.getElementById（ 'LISTA-productoss'）;''到變種lista_productos =的document.getElementById（'lista- productos'）;' – Lixus

請勿使用.innherHTML，而應更新變量。

.innerHTML將用於DOM中的元素，但是，您使用它的變量只是一個字符串，因此它無法找到您引用的元素，因爲它只能看到空字符串。有關.innerHTML的更多信息，您可以查看here。

變化：

lista_productos.innerHTML= ''; 
for (var i = 0; i< listadoProductos.length; i++){ 
    lista_productos.innerHTML += listadoProductos[i] + '<br/>'; 
}

到：

lista_productos = ''; 
for (var i = 0; i< listadoProductos.length; i++){ 
    lista_productos += listadoProductos[i] + '<br/>'; 
}

來源

2017-05-25 22:11:26 jkys

我需要在html中打印結果 – jefferson

您有一個錯字。額外的S Tienes un errortipográfico。聯合國額外的「s」

var lista_productos = document.getElementById('lista-productoss');

應該是： debiera SER：

var lista_productos = document.getElementById('lista-productos');

而且，你的HTML定義了這個div爲CLASS LISTA-PRODUCTOS ...

<div class="lista-productos"> 
</div>

更改爲

<div id="lista-productos"> 
</div>

來源

2017-05-25 22:03:33 SactoJosh

謝謝我糾正了它，但仍然在79行中留下錯誤，它說： lista_productos.innerHTML =''; – jefferson

謝謝你非常有幫助，正如你所說的解決它 – jefferson

遺漏的類型錯誤：不能設置爲空的特性「的innerHTML」

回答

相關問題