javascript - 如何在jquery中选择预览选择器

Question

我一直在尝试各种方法，但似乎无法获得正确的组合。这是 dom:

<!-- Main Blog Content -->
<div class="orbit-container row">
  <ul class="camp orbit-slides-container slide">
    <li></li>
    <li></li>
  </u>
  <a href="#" class="orbit-prev"><span></span></a>
  <a href="#" class="orbit-next"><span></span></a>
</div>

<div class="row">
  <div class="small-12 hide-for-medium-up columns text-center">
    <a class="nav-out outside-prev" href="#">
      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 20.9 36.1" enable-background="new 0 0 20.9 36.1" xml:space="preserve" class="svg replaced-svg">
        <g>
          <polygon fill="#2A2A2A" points="18,0 20.9,2.9 5.7,18 20.9,33.2 18,36.1 0,18  "></polygon>
        </g>
      </svg>
    </a>
    <a class="rotate-next nav-out" href="#" style="-webkit-transform: rotate(180deg);">
      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 20.9 36.1" enable-background="new 0 0 20.9 36.1" xml:space="preserve" class="svg replaced-svg">
        <g>
          <polygon fill="#2A2A2A" points="18,0 20.9,2.9 5.7,18 20.9,33.2 18,36.1 0,18  "></polygon>
        </g>
      </svg>
    </a>
  </div>
  <div class="small-12 medium-10 columns meta">
    <h2>Header</h2>
    <p>Filler text</p>
  </div>
  <div class="medium-1 columns">
    <a class="nav-out hide-for-small outside-prev" href="#">
      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 20.9 36.1" enable-background="new 0 0 20.9 36.1" xml:space="preserve" class="svg replaced-svg">
        <g>
          <polygon fill="#2A2A2A" points="18,0 20.9,2.9 5.7,18 20.9,33.2 18,36.1 0,18  "></polygon>
        </g>
      </svg>
    </a>
  </div>
  <div class="medium-1 columns">
    <a class="rotate-next nav-out hide-for-small outside-next" href="#" style="-webkit-transform: rotate(180deg);">
      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 20.9 36.1" enable-background="new 0 0 20.9 36.1" xml:space="preserve" class="svg replaced-svg">
        <g>
          <polygon fill="#2A2A2A" points="18,0 20.9,2.9 5.7,18 20.9,33.2 18,36.1 0,18  "></polygon>
        </g>
      </svg>
    </a>
  </div>
</div>

当我单击 .row > .medium-10 > a 中的下一个按钮时，我需要单击 .full-width .orbit-container a.orbit-next

我该怎么做？

我有多个，需要选择最衣柜里的一个，否则所有操作都是相同的

Answer 1

尝试这样的事情:

 $(".row .medium-10 a").click(function(){

     $(this).closest(".orbit-container").find("a.orbit-next").click();

     // or 

     $(this).closest(".orbit-container").find("a.orbit-next").trigger("click");

});