Javascript añadido a la cabecera del tema devuelve $ no está definido

Desarrollador
1

Hola,

En Administrador > Personalizar > Temas > en la sección de encabezado, agregué lo siguiente pero me devuelve:
Error de referencia no capturado: $ no está definido

<script>
$(document).ready(function() {
$('.topic-list .topic-excerpt[href=\"/t/urltobechanged/8\"]').attr('href', \"/t/newurltoset/17 \");
});
</script>

Sin embargo, si agrego lo siguiente, funciona bien sin errores:

<script>
  console.log("¡Hola, Discourse!");
</script>

Principalmente, este error de “$ no está definido” ocurre porque jQuery no está cargado, sin embargo, ¿los scripts del encabezado no deberían ejecutarse por defecto después de que se cargue jQuery?

2

Usa JavaScript nativo, no jQuery.

2 Me gusta
3

Gracias, pero si esto es javascript, funciona bien cuando se usa en la consola del desarrollador
document.querySelector('.topic-list .topic-excerpt[href="/t/urltobechanged/8"]').setAttribute('href', "/t/newurltoset/17");

De alguna manera, cuando se carga desde la cabecera de discourse, se devuelve como “Uncaught TypeError: document.querySelector(…) is null”, sin importar si lo envuelvo con:

function doSomething() {
or
document.addEventListener("DOMContentLoaded", function(event)

¿Alguna idea de cómo ejecutar esta única línea para cambiar el atributo href, ya que funciona bien en la consola del desarrollador?

4

Dado que Discourse es una SPA, depender de “DOMContentLoaded” del documento no será muy útil, ya que el DOM del documento siempre está “cargado” pero los elementos pueden faltar. En su lugar, querrás usar Componentes como mencionó @merefield, o algo como esto: How do you force a script to refire on every page load in Discourse? - #5 by simon. De esta manera, cada vez que la página cambie, tu código podrá buscar el elemento que intentas cambiar.

1 me gusta
5

Entendido, ahora comprendo, viniendo del desarrollo de WordPress/Joomla, crees que añadir JS al encabezado funcionaría de la misma manera.

Tu enlace proporciona efectivamente una solución, ten en cuenta que ahora los encabezados <script type='text/discourse-plugin'> están obsoletos Modernizing inline script tags for templates & JS API

Para resolver rápidamente la situación de la URL, terminé creando un permalink directamente desde la administración de Discourse.

¡Gracias por el apoyo y la explicación!

1 me gusta