Tengo muchos artículos que tienen 1, 2, 3 o 4 imágenes. En el móvil creé un carrusel. Todas las imágenes están en la misma línea y tengo un conteo que es 0. Y cuando presiono el botón derecho (por ejemplo), ese conteo será -100 y todas las imágenes tendrán una izquierda: -100 y así sucesivamente. El problema es que, digamos, presiono el botón de un artículo que contará -100. pero después voy a otro artículo y si vuelvo a presionar el conteo no es -100 y es -200. ¿Cómo puedo restablecer ese conteo cuando cambio el artículo? El código es algo como:
var c = 0; $('.plus').on('click', function(){ c += 100 $(this).siblings('.num').text(c) }) <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="article"> <div class="minus">Minu</div> <div class="plus">Plus </div><div class="num">0</div> </div> <div class="article"> <div class="minus">Minu2</div> <div class="plus">Plus2 </div><div class="num">0</div> </div> <div class="article"> <div class="minus">Minu3</div> <div class="plus">Plus3 </div><div class="num">0</div> </div> <div class="article"> <div class="minus">Minu4</div> <div class="plus">Plus4 </div><div class="num">0</div> </div> <div class="article"> <div class="minus">Minu5</div> <div class="plus">Plus5 </div><div class="num">0</div> </div>Esto es lo que cociné para ti.
$('.plus').on('click', function(){ c = Number($(this).siblings('.num').text()) + 100; $(this).siblings('.num').text(c) }); $('.minus').on('click', function(){ c = Number($(this).siblings('.num').text()) - 100; $(this).siblings('.num').text(c) }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="article"> <div class="minus">Minu</div> <div class="plus">Plus</div> <div class="num">0</div> </div> <div class="article"> <div class="minus">Minu2</div> <div class="plus">Plus2</div> <div class="num">0</div> </div> <div class="article"> <div class="minus">Minu3</div> <div class="plus">Plus3</div> <div class="num">0</div> </div> <div class="article"> <div class="minus">Minu4</div> <div class="plus">Plus4</div> <div class="num">0</div> </div> <div class="article"> <div class="minus">Minu5</div> <div class="plus">Plus5</div> <div class="num">0</div> </div> El botón Más sumará al total mostrado para el artículo actual y Menos lo restará. Cada artículo tiene su propio valor c que no se puede cambiar con un botón de un artículo diferente.
Espero que eso sea lo que estás buscando.
Agregue un controlador on('click', function() {...}) a su botón "cambiar el artículo". Si este botón es solo el texto de otro artículo, asígneles a todos una clase común y un controlador onclick de clase común.
HTML...
<span class="article">Article 1</span> <span class="article">Article 2</span> <span class="article">Article 3</span>jQuery...
$('.article').on('click', function() { c = 0; });