Keskustelu: Nettisivujen teko: jQueryn vaihtoehtoiset valinnat

Minulla on tekeillä kuvaeistys. Kuvia on kahden eri elementin sisällä. Onko mahdolista tarkistaa jotenkin että jompaa kumpaa on klikattu.
Siis:

$('#abc_1').click();
$('#abc_2').click();

Tätä pohdin siksi, ettei tarttisi molemmille elementeille lisätä kuvaesitys-skriptiä, vaan ne voisi käyttää samaa skriptiä.

jQueryn (ja yleensä mikä tahansa onClick) palauttaa kielestä riippuen klikatun elementin.

Itse sen sijaan tykkään laittaa yksilöiviä attribuutteja, joko css-luokkana taikka data-attribuuttina:

Jqueryssä voit saada sen seuraavasti:

<div class="slideshow-clickable slideshow-frontpage" data-foobar="frontpage">...</div>
<div class="slideshow-clickable slideshow-otherpage" data-foobar="otherpage">...</div>

$(".slideshow-clickable").click( function(e){

   var klikattavaElementti = $(this); // tätä sinä kysyit
   var dataId = $(this).data("foobar");   // tätä minä käyttäisin
   console.log(["-- klikattiin elementtiä --", dataId])
   if (dataId=="frontpage"){
      // ...
   }

});

En käyttäisi selectorina id -attribuuttia, koska tällöin elementtejä ei saisi olla kahta samalla sivulla samalla id:llä. Elementtejä, joilla on samoja classeja voi olla useita samalla sivulle. Sama koodinpätkä siis toimisi nyt suoraan, oli "slideshow-clickable" -elementtejä sivulla kuinka monta tahansa.

Lebe80 kirjoitti:

(14.12.2018 08:22:16): jQueryn (ja yleensä mikä tahansa...

Kiitos. Päädyin muuttamaan kuvaesityksen tapaa. Tämä kuvaesitys luo kuvaesityksen verkkokaupan jostakin tuotteesta, kun siinä on useampia lisäkuvia. Tämä kuvaesitys on myös valinnainen, niin että sen saa admin sivulla muutettua Päällä/Pois. Niimpä tein yksinkertaisen homman, että jos kuvaesitys on asetettu päälle, tuotteen lisäkuvien "peukalonkynsi-kuvia" ei näytetä tuotesivulla.