News:

Want to get involved in developing SMF, then why not lend a hand on our github!

Main Menu

[Problema] Conflictos de JS

Started by Jotade29, August 20, 2022, 06:45:31 PM

Previous topic - Next topic

Jotade29

Buenas, tengo un problema que, hasta donde he podido ver, ocurre con librerías de JS, cuando se usa en ambas, por ejemplo, el símbolo del dólar ($).

Cuando hay algún conflicto, suele cascar error de $ is not a function...

La solución que he probado es ponerlo en modo no conflicto... Es decir, si tengo el siguiente script que me da conflicto:

jQuery(document).ready(function($){
$('.sp-body img').each(function() {
$(this).attr({
alt: $(this).attr('src'),
src: smf_default_theme_url + '/images/loading.gif'
});
});
$("body").on("click", ".sp-head", function(event){
$this = $(this);
if ($this.hasClass("unfolded")) {
$this.removeClass("unfolded");
$this.next().slideUp("fast");
$this.next().addClass("folded");
} else {
$this.addClass("unfolded");
$this.next().slideDown("fast");
$this.next().removeClass("folded");
}
c = $this.parent().children('.sp-body');
c.find('img').each(function() {
$(this).attr('src', $(this).attr('alt'));
});
});
$("body").on("click", ".sp-foot", function(event){
$this = $(this).closest("div.sp-body").prev();
if ($this.hasClass("unfolded")) {
$this.removeClass("unfolded");
$this.next().slideUp("fast");
$this.next().addClass("folded");
}
});
});

El modo no conflicto creo que sería algo así... Digo eso porque no me funciona, y debería...

var landa = jQuery.noConflict();
landa(document).ready(function($){
$('.sp-body img').each(function() {
$(this).attr({
alt: $(this).attr('src'),
src: smf_default_theme_url + '/images/loading.gif'
});
});
$("body").on("click", ".sp-head", function(event){
$this = $(this);
if ($this.hasClass("unfolded")) {
$this.removeClass("unfolded");
$this.next().slideUp("fast");
$this.next().addClass("folded");
} else {
$this.addClass("unfolded");
$this.next().slideDown("fast");
$this.next().removeClass("folded");
}
c = $this.parent().children('.sp-body');
c.find('img').each(function() {
$(this).attr('src', $(this).attr('alt'));
});
});
$("body").on("click", ".sp-foot", function(event){
$this = $(this).closest("div.sp-body").prev();
if ($this.hasClass("unfolded")) {
$this.removeClass("unfolded");
$this.next().slideUp("fast");
$this.next().addClass("folded");
}
});
});

El error que salta en el depurador es:

"$(...).on is not a function" de la siguiente línea "$("body").on("click", ".sp-head", function(event){"

Lo hago por variable, asignando a landa el valor de no conflicto y metiéndoselo a la función que antes se llamaba jQuery... No sé lo que ando haciendo mal, ¿alguna idea? Muchas gracias.
Quote from: Diego Andrés on August 12, 2023, 02:20:18 AMI'm afraid convincing Jotade to upgrade to SMF 2.1 will require bigger effort than your work sanitizing Unicode characters  :laugh:

Danielㅤ

Hola, prueba usando doble signo peso ($$) para que no lo tome como una función, si eso no funciona prueba con una barra invertida por ejemplo \$ para usar una secuencia de escape.


Saludos

Jotade29

Quote from: Daniel� on August 20, 2022, 06:53:47 PMHola, prueba usando doble signo peso ($$) para que no lo tome como una función, si eso no funciona prueba con una barra invertida por ejemplo \$ para usar una secuencia de escape.


Saludos

Gracias por responder, Daniel. La solución que me has dado no me funciona, puede ser que no la sepa aplicar bien.

jQuery(document).ready(function($$){
$('.sp-body img').each(function() {
$(this).attr({
alt: $(this).attr('src'),
src: smf_default_theme_url + '/images/loading.gif'
});
});
$$("body").on("click", ".sp-head", function(event){
$this = $(this);
if ($this.hasClass("unfolded")) {
$this.removeClass("unfolded");
$this.next().slideUp("fast");
$this.next().addClass("folded");
} else {
$this.addClass("unfolded");
$this.next().slideDown("fast");
$this.next().removeClass("folded");
}
c = $this.parent().children('.sp-body');
c.find('img').each(function() {
$(this).attr('src', $(this).attr('alt'));
});
});
$("body").on("click", ".sp-foot", function(event){
$this = $(this).closest("div.sp-body").prev();
if ($this.hasClass("unfolded")) {
$this.removeClass("unfolded");
$this.next().slideUp("fast");
$this.next().addClass("folded");
}
});
});

También he probado a poner dentro de la ready function (\|$) saliéndome el error de secuencia de escape inválida
Quote from: Diego Andrés on August 12, 2023, 02:20:18 AMI'm afraid convincing Jotade to upgrade to SMF 2.1 will require bigger effort than your work sanitizing Unicode characters  :laugh:

Danielㅤ

Prueba a dejar la función sln parámetro:

jQuery(document).ready(function()


Saludos

Jotade29

Quote from: Daniel� on August 20, 2022, 07:08:10 PMPrueba a dejar la función sln parámetro:

jQuery(document).ready(function()


Saludos

Muchas gracias por la ayuda, Daniel. Lamentablemente sigue sin funcionar. Ambos mods usan la librería jquery.min.js...
Quote from: Diego Andrés on August 12, 2023, 02:20:18 AMI'm afraid convincing Jotade to upgrade to SMF 2.1 will require bigger effort than your work sanitizing Unicode characters  :laugh:

-Rock Lee-

¿Es necesario aplicarlo directo en el jquery? No te servira nada tipo "$" o similar con comillas simples, tenes imprimirlo directo usando la funcion html o convertir de ascii al menos puedas aplicarlo despues que seria lo mas practico.


Saludos!
¡Regresando como cual Fenix! ~ Bomber Code
Ayudas - Aportes - Tutoriales - Y mucho mas!!!

Dhayzon

para que usar el no conflict,? odio esa característica

mete tu Código jquery dentro
$( document ).ready(function() {
     /***codigo aqui***/
});


debería funcionar normal, no tienes códigos del otro mundo  que requieran del no conflict

el no conflict lo usaban con el extinto Mootools  alla por el 2010, por que tenia un Código similar al de jquery





Advertisement: