Estoy jugueteando con https://pawelgrzybek.github.io/siema/ y me he encontrado con este ejemplo interesante:
https://codepen.io/pawelgrzybek/pen/gWYLXP
Este ejemplo contiene el uso de eventos en elementos del DOM, en este caso una serie de botones. Mi objetivo era conseguir que estos objetos, se generasen en base a un X número, para tener en lugar de solo 4, los botones que hagan falta como se puede ver a continuación.
$( document ).ready(function() {
$('<div class="bwmbullets"><ol></ol></div>').appendTo('.unique-events');
$('<div class="siema"></div>').appendTo('.unique-events');
$.each(e_destacados, function(index, value) {
$('<li id="be-'+index+'" onclick="bulletChange('+index+')"></li>').appendTo('.bwmbullets');
$('<div id="ev-'+index+'" class="event"><img id="ev-'+index+'" src="/uploads/pics/'+value.img+'"></div>').appendTo('.siema');
});
const mySiema = new Siema({
perPage: 2,
onInit: bulletChange,
onChange: bulletChange,
});
});
function bulletChange(n) {
mySiema.goTo(n);
console.log(this.currentSlide);
}
El problema es cuando intento adaptar dicho evento a mi código. Al llamar a "mySiema.goTo(n)" recibo un error de que mySiema no está definida.
El evento y función original es la siguiente:
btn0.addEventListener('click', () => mySiema.goTo(0));
¿Cómo puedo conseguir llamar la función goTo?
mySiema.goTo(n);
porthis.goTo(n)
ya que es el propio objeto.