Estoy intentando hacer un DIV plegable (y con suerte simple) y estaba trabajando con otra respuesta que había encontrado aquí en el desbordamiento de la pila, pero parece que no puedo hacer que funcione en mi sitio web. Tengo un violín con los enlaces completos y la codificación que muestra que realmente funciona (en el violín), pero luego ingreso el código en mi página y oculta las cosas debajo de la primera imagen (usándola como divisor), pero cuando haga clic en él no pasa nada (no se muestra)
A continuación se muestra el fragmento de codificación HTML:
<p class="expand-one"><a href="#"></a> <img src="https://www.mywebsite.net/something/vip1.png"></p> <p class="content-one"> <td width="33%" align="center" valign="top"> <br> </td> <td width="33%" align="center" valign="top"> <a href="http://www.mywebsite.net/bigslice" title="The Big Slice: Home of the Edge"> <font color="#dace77">[ music ]</font> </a><br> <font color="#FAF9B6">$ROOMNAME bigslice$</font><br>$USERLIST bigslice$<br> </td> </tr> </p>y arriba en mi CSS tengo la simple adición de:
<style>p.content-one { display: none; } </style>Y abajo, antes de que termine el cuerpo, donde están todos mis scripts JS, tengo
<script> $('.expand-one').click(function() { $('.content-one').slideToggle('slow'); }); </script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>Dado que la respuesta fue tan simple como que jQuery no se carga antes de que el código lo use, pensé en publicar los pasos de solución de problemas que sugerí como respuesta. La pregunta puede estar marcada como un duplicado, pero si no, tal vez alguien se tropiece con ella y reciba ayuda... no sé.
$(document).on('click', 'p', function() { /*...*/ }) adjuntará un oyente a todo el documento que solo se ejecutará cuando se haga clic en un párrafo), o use $(function() { /* code here */ }) para asegurarse de que su código no se ejecute hasta que la página ha terminado de cargar.console.log() es extremadamente útil si no está seguro de si el código simplemente no se ejecutará, o si se está ejecutando y no afecta nada. Si no se registra nada, el código no se está ejecutando.