Domanda

Mentre ci sono un sacco di buone risorse per attraversare il DOM con jQuery non sto avendo fortuna per il mio esempio.

Sul mio sito www.smithgrey.co.uk Ho una serie di gallerie di anteprima tutte dotate di una "sezione Titolo" div di fronte a loro.

Quello che voglio raggiungere è quando fai clic sulla "Titolo della sezione" Div Il primo collegamento <a href> della miniatura sulla destra si fa clic sulla destra.

Ci sono più istanze del class="section-title" - sfortunatamente non sono in grado di aggiungere alcun ID o classi poiché questo è generato dinamicamente e è stato chiesto di tenerlo come è possibile.

L'HTML è simile a questo:

<body>
  <div id="content-grid">
    <div class="section-title">
      <span class="section-title-type">Title of the first thumbnail gallery</span>
    </div>

    <div class="index-article">
      <a href="#" class="fancybox">
        <img src="thumbnail-1">
      </a>
    </div>

    <div class="section-title">
      <span class="section-title-type">Title of the second thumbnail gallery</span>
    </div>

    <div class="index-article">
      <a href="#" class="fancybox">
        <img src="thumbnail-2">
      </a>
    </div>

    <div class="index-article">
      <a href="#" class="fancybox">
        <img src="thumbnail-3">
      </a>
    </div>

    <div class="index-article">
      <a href="#" class="fancybox">
        <img src="thumbnail-4">
      </a>
    </div>   
  </div>
</body>
.

Ed ecco la mia jquery finora ma non produce il risultato che immaginerei perché farebbe clic sul collegamento, non importa se faccio clic sul primo o dal secondo <div class="section-title">.

$('div.section-title').click( function(){
       $(this).parent().next($('div.index-article')).children('a.fancybox').click();
     });
.

Soluzione:

Con l'aiuto degli altri commentari sono riuscito a capire come farlo funzionare come mi aspettavo:

$(document).ready(function() {
  $('div.section-title').click( function(){
    $(this).next('.index-article').find('a.fancybox:first').click();
  });
});
.

È stato utile?

Soluzione

Suppongo che tu abbia configurato la jQuery corretta con l'evento pronto / ecc.È così che lo farei.Si prega di notare che ho aggiunto un evento di clic sul collegamento ipertestuale per simulare il clic nell'esempio JSFIDDLE.

http://jsfiddle.net/lucuma/s9mds/

$('div.section-title').click(function(e) {
    $(this).next('div').find('a:eq(0)').click(); 
});​
.

Altri suggerimenti

Usa questo

 $(document).ready(function() {
   $('div.section-title').click( function(){
     $(this).closest($('div.index-article').find('a.fancybox').click();
   });
});
.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top