Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » HTML » Ayuda, No funciona código

HTML - Ayuda, No funciona código

Volver
Nuevo Tema
<<>>
 
Vista:

Ayuda, No funciona código

Publicado por Biopi (1 intervención) el 30/01/2022 19:42:13
Hola,
necesito asesoramiento, soy amateur. Estamos desarrollando (sin ánimo de lucro) una escala de valoración médica para una app, pero al ir aumentando el número de botones de selección, el código deja de funcionar y no carga lo programado, quedándose la página en blanco.
Necesitamos que se vean todos los botones ya que el usuario ha de ir seleccionando el ítem que corresponda (cada ítem tiene un valor numérico determinado) y al final te da la puntuación final o resultado. Es similar a una calculadora.
¿Podríais ayudarnos a encontrar la solución? Gracias
El código que tenemos es:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Escala PedNIHSS</title>
[[OFFLINE_BULMA_CSS]] [[OFFLINE_VUE_JS]]
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>[v-cloak] {
display: none;
}</style>
</head>
<body>
<div id="app" class="content" v-cloak>
<div class="columns is-marginless">
<div class="column">
<h5></h5>
<div class="field">
<p class="label">Edad</p>
<p class="button is-fullwidth" :class="{'is-primary': age === 0}" @click="age = 0">Niños entre 4 meses y 2 años</p>
<p class="button is-fullwidth" :class="{'is-primary': age === 1}" @click="age = 1">Niños mayores 2 años</p>
</div>
<div class="field" v-if="age == 0">
<p class="label">1a. Nivel de conciencia</p>
<p class="button is-fullwidth" :class="{'is-primary': fr === 0}" @click="fr = 0">Alerta</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': fr === 1}" @click="fr = 1">Somnoliento, pero se despierta facilmente tras estímulos</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': fr === 2}" @click="fr = 2">Estupuroso.Precisa estímulos repetidos, fuertes o dolorosos para responder o hacer movimientos (no estereotipados)</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': fr === 3}" @click="fr = 3">Responde solo con reflejos motores o efectos autonómicos o no responde en absoluto</p>
</div>
<div class="field" v-if="age == 1">
<p class="label">1a. Nivel de conciencia</p>
<p class="button is-fullwidth" :class="{'is-primary': fr === 0}" @click="fr = 0">Alerta</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': fr === 1}" @click="fr = 1">Somnoliento, pero se despierta facilmente tras estímulos</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': fr === 2}" @click="fr = 2">Estupuroso.Precisa estímulos repetidos, fuertes o dolorosos para responder o hacer movimientos (no estereotipados)</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': fr === 3}" @click="fr = 3">Responde solo con reflejos
motores o efectos autonómicos o no responde en absoluto</p>
</div>
<div class="field" v-if="age == 1">
<p class="label">1b. Preguntas</p>
<p class="button is-fullwidth" :class="{'is-primary': silbancias === 0}" @click="silbancias = 0"> Ambas respuestas son correctas</p>
<p class="button is-fullwidth" :class="{'is-primary': silbancias === 1}" @click="silbancias = 1">Una respuesta correcta</p>
<p class="button is-fullwidth" :class="{'is-primary': silbancias === 2}" @click="silbancias = 2">Ninguna respuesta correcta</p>
</div>
<div class="field" v-if="age == 1">
<p class="label">1c. Ordenes</p>
<p class="button is-fullwidth" :class="{'is-primary': ordenes === 0}" @click="ordenes = 0"> Realiza ambas órdenes correctamente</p>
<p class="button is-fullwidth" :class="{'is-primary': ordenes === 1}" @click="ordenes = 1">Realiza una tarea correctamente</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': ordenes === 2}" @click="ordenes = 2">No realiza ninguna de las tareas correctamente</p>
</div>
<div class="field">
<p class="label">2. Mirada</p>
<p class="button is-fullwidth" :class="{'is-primary': mir === 0}" @click="mir = 0">Normal</p>
<p class="button is-fullwidth" :class="{'is-primary': mir === 1}" @click="mir = 1">Parálisi parcial de la mirada</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': mir === 2}" @click="mir = 2">Desviación forzada o parálisi total de la mirada, que no es superada por las maniobras óculo cefálicas</p>
</div>
<div class="field">
<p class="label">3. Visual</p>
<p class="button is-fullwidth" :class="{'is-primary': vis === 0}" @click="vis = 0">No déficit del campo visual</p>
<p class="button is-fullwidth" :class="{'is-primary': vis === 1}" @click="vis = 1">Hemianopsia parcial / Cuadrantanopsia. </p>
<p class="button is-fullwidth" :class="{'is-primary': vis === 2}" @click="vis = 2">Hemianospsia completa</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': vis === 3}" @click="vis = 3">Hemianopsia bilateral (ceguera, incluyendo ceguera cortical).</p>
</div>
<div class="field">
<p class="label">4. Parálisis facial</p>
<p class="button is-fullwidth" :class="{'is-primary': pf === 0}" @click="pf = 0">Movimiento simétrico normal.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pf === 1}" @click="pf = 1">Parálisis leve (borramiento del surco nasogeniano, asimetría en la sonrisa, labio superior fláccido)</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pf === 2}" @click="pf = 2">Parálisis parcial (parálisis total o casi total de la musculatura de la mitad inferior de la cara)</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pf === 3}" @click="pf = 3">Parálisis completa de uno o ambos lados (ausencia de movimientos faciales en la mitad superior e inferior de la cara).</p>
</div>
<div class="field">
<p class="label">5a.Función motora del brazo derecho (Paresia de extremidades superiores)</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': bd === 0}" @click="bd = 0">No caída, el brazo se mantiene elevado 90º (o 45º) durante 10 segundos</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': bd === 1}" @click="bd = 1">Claudicación, el brazo se mantiene elevado a 90º (o 45º) pero cae antes de los 10 segundos, sin llegar a caer del todo</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': bd === 2}" @click="bd = 2">El brazo no puede elevarse o mantener los 90º (o 45º), cae a la cama, pero se observa cierto esfuerzo contra gravedad</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': bd === 3}" @click="bd = 3">No esfuerzo contra gravedad, el brazo cae completamente.</p>
<p class="button is-fullwidth" :class="{'is-primary': bd === 4}" @click="bd = 4">No movimiento</p>
<p class="button is-fullwidth" :class="{'is-primary': bd === 9}" @click="bd = 9">Amputación, fusión articular</p>
</div>
<div class="field">
<p class="label">5b.Función motora del brazo izquierdo (Paresia de extremidades superiores)</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': bi === 0}" @click="bi = 0">No caída, el brazo se mantiene elevado 90º (o 45º) durante 10 segundos</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': bi === 1}" @click="bi = 1">Claudicación, el brazo se mantiene elevado a 90º (o 45º) pero cae antes de los 10 segundos, sin llegar a caer del todo</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': bi === 2}" @click="bi = 2">El brazo no puede elevarse o mantener los 90º (o 45º), cae a la cama, pero se observa cierto esfuerzo contra gravedad</p>
<p class="button is-fullwidth"style="white-space: normal;height: 100%;" :class="{'is-primary': bi === 3}" @click="bi = 3">No esfuerzo contra gravedad, el brazo cae completamente.</p>
<p class="button is-fullwidth" :class="{'is-primary': bi === 4}" @click="bi = 4">No movimiento</p>
<p class="button is-fullwidth" :class="{'is-primary': bi === 9}" @click="bi = 9">Amputación, fusión articular</p>
</div>
<div class="field">
<p class="label">6a. Función motora de la pierna derecha (Paresia extremidades inferiores)</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pd === 0}" @click="pd = 0">No caída, la pierna se mantiene elevada 30º durante 5 segundos.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pd === 1}" @click="pd = 1">Claudicación, la pierna se mantiene elevada a 30º pero cae antes de los 5 segundos, sin llegar a caer del todo.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pd === 2}" @click="pd = 2"> La pierna no puede elevarse o mantener los 30º, cae a la cama, pero se observa cierto esfuerzo contra gravedad.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pd === 3}" @click="pd = 3">No esfuerzo contra gravedad, la pierna cae completamente.</p>
<p class="button is-fullwidth" :class="{'is-primary': pd === 4}" @click="pd = 4">No movimiento</p>
<p class="button is-fullwidth" :class="{'is-primary': pd === 9}" @click="pd = 9">Amputación, fusión articular</p>
</div>
<div class="field">
<p class="label">6b. Función motora de la pierna izquierda (Paresia extremidades inferiores)</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pi === 0}" @click="pi = 0">No caída, la pierna se mantiene elevada 30º durante 5 segundos.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pi === 1}" @click="pi = 1">Claudicación, la pierna se mantiene elevada a 30º pero cae antes de los 5 segundos, sin llegar a caer del todo.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pi === 2}" @click="pi = 2"> La pierna no puede elevarse o mantener los 30º, cae a la cama, pero se observa cierto esfuerzo contra gravedad.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': pi === 3}" @click="pi = 3">No esfuerzo contra gravedad, la pierna cae completamente.</p>
<p class="button is-fullwidth" :class="{'is-primary': pi === 4}" @click="pi = 4">No movimiento</p>
<p class="button is-fullwidth" :class="{'is-primary': pi === 9}" @click="pi = 9">Amputación, fusión articular</p>
</div>
<div class="field">
<p class="label">7. Ataxia de los miembros</p>
<p class="button is-fullwidth" :class="{'is-primary': at === 0}" @click="at = 0">No ataxia</p>
<p class="button is-fullwidth" :class="{'is-primary': at === 1}" @click="at = 1">Ataxia en un miembro</p>
<p class="button is-fullwidth" :class="{'is-primary': at === 2}" @click="at = 2">Ataxia en ambos miembros.</p>
</div>
<div class="field">
<p class="label">8. Sensibilidad</p>
<p class="button is-fullwidth" :class="{'is-primary': se === 0}" @click="se = 0"> Normal, no pérdida sensitiva.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': se === 1}" @click="se = 1">Pérdida de sensibilidad débil o moderada (el paciente nota el contacto pero no percibe si es la punta o el lado plano).</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': se === 2}" @click="se = 2">Anestesia. El paciente no es consciente de estar siendo tocado en la cara, brazo y pierna</p>
</div>
<div class="field"v-if="age == 0">
<p class="label">9. Lenguaje</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': le === 1}" @click="le = 1">Alerta al sonido y se orienta visualmente o se evidencia un comportamiento hacia la localización del sonido</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': le === 2}" @click="le = 2"> Alerta al sonido, pero no tiene un comportamiento de orientación espacial hacia el sonido.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': le === 2}" @click="le = 2"> No está alerta al sonido ni se orienta hacia él.</p>
</div>
<div class="field"v-if="age == 1">
<p class="label">9. Lenguaje</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': le === 0}" @click="le = 0">Normal, sin afasia.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': le === 1}" @click="le = 1">Afasia leve o moderada: el paciente tiene difcultades de habla y/o comprensión pero puede identifcarse lo que dice</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': le === 2}" @click="le = 2"> Afasia grave: sólo hay una comunicación mínima y es muy difícil identifcar lo que el paciente quiere decir.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': le === 3}" @click="le = 3">Afasia global, mutismo: incapaz de hablar y comprender..</p>
</div>
<div class="field">
<p class="label">10. Disartria</p>
<p class="button is-fullwidth" :class="{'is-primary': di === 0}" @click="di = 0"> Normal.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': di === 1}" @click="di = 1">Disartria leve o moderada. Balbucea al menos algunas palabras y puede ser entendido con alguna difcultad</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': di === 2}" @click="di = 2">Disartria grave: ininteligible en ausencia de afasia, o desproporcionada al grado de afasia, o es mudo o anartrico.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': di === 9}" @click="di = 9">Intubado u otra barrera física.</p>
</div>
<div class="field">
<p class="label">11. Extinción (supresión, inatención) y negligencia</p>
<p class="button is-fullwidth" :class="{'is-primary': ex === 0}" @click="ex = 0">No alteración.</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': ex === 1}" @click="ex = 1">Extinción frente a la estimulación bilateral simultanea o negligencia en una de las modalidades sensoriales</p>
<p class="button is-fullwidth" style="white-space: normal;height: 100%;":class="{'is-primary': ex === 2}" @click="ex = 2">Hemi-extinción severa o negligencia en más de un estímulo. No reconoce su mano o atiende solo a un lado del espacio</p>
</div>
<article class="message" :class="classNotification">
<div class="message-header">
<p class="is-marginless">Resultado</p>
<button class="delete" aria-label="delete" @click="reset()" v-if="score > 0"></button>
</div>
<div class="message-body has-text-centered">
<p>
Puntuación: {{ score }}
</p>
<b v-if="score >= 0 && score <= 3">Leve </b>
<b v-if="score >= 4 && score < 16">Moderada</b>
<b v-if="score >= 16 && score < 25">Grave</b>
<b v-if="score >= 25">Muy Grave</b>
<p>Indica la necesidad de tratamiento revascularizador: NIHSS entre 4 y 25</p>
</div>
</article>
</div>
</div>
</div>
<script>
"use strict";
new Vue({
el: '#app',
data: {
age: 0,
fr: 0,
silbancias: 0,
ordenes: 0,
mi: 0,
vis: 0,
pf: 0,
bd: 0,
bi: 0,
pd: 0,
pi: 0,
at: 0,
se: 0,
le: 0,
di: 0,
ex: 0

},
computed: {
score() {
return this.fr + this.silbancias + this.ordenes + this.mi + this.vis + this.pf + this.bd + this.bi + this.pd + this.pi + this.at + this.se + this.le + this.di + this.ex;
},
classNotification() {
if (this.score >= 0 && this.score <= 3) return 'is-info';
if (this.score >= 4 && this.score < 16) return 'is-warning';
if (this.score >= 16) return 'is-danger';
}
},
methods: {
reset() {
this.age = 0;
this.fr = 0;
this.silbancias = 0;
this.ordenes = 0;
this.mi = 0;
this.vis = 0;
this.pf = 0;
this.bd = 0;
this.bi = 0;
this.pd = 0;
this.pi = 0;
this.at = 0;
this.se = 0;
this.le = 0;
this.di = 0;
this.ex = 0;
}
}
});
</script>
</body>

</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

Saludos!

Publicado por Ariana (1 intervención) el 31/08/2022 14:07:04
Saludos!
Soy Senior Developer, trate de verificar cada linea, pero no encontré nada. Intente quitar algún párrafo del codigo y verifique si ya funciona. En muchos códigos también me pasa esto, así que le recomiendo hacerlo. Algo que seguramente le funcionara es poner su codigo aquí: http://validator.w3.org. y este mismo le enseñara donde esta el error. Si no es así, puedes buscar mas información en internet (Reddit, GitHub, Stack Overflow, paginas web...).
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Ivan

Saludos!

Publicado por Ivan (56 intervenciones) el 31/08/2022 17:35:03
Hola,

al margen de que el código parece una plantilla que debe pasar por algún tipo de "parseador ", tal y como está no se visualiza porque tienes la instrucción CSS:

1
2
3
<style>[v-cloak] {
display: none;
}</style>

Al principio, justo debajo de <meta name="viewport" content="width=device-width, initial-scale=1">

Esto hace que no se muestre el contenido, o lo quitas o lo cambias a display: block

Un saludo!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar