jQuery：点击带selected类的orderline的下一个元素（支持循环至首个）

Let's break down how to implement this "click next element with wrap-around" functionality smoothly:

1. Target the currently selected element
   First, we grab the element with the selected class inside your .orderline container:

   const $currentSelected = $('.orderline .selected');
   

2. Check if we’re at the last item
   Use jQuery’s :last-child selector to determine if the selected element is the final sibling in the list:

   const isLastItem = $currentSelected.is(':last-child');
   

3. Handle both scenarios

   • If it’s not the last item, just trigger a click on the next sibling using .next()
   • If it is the last item, target and click the first sibling in the same parent container

Here’s the full reusable code:

function triggerNextOrderlineClick() {
  const $currentSelected = $('.orderline .selected');
  const $allSiblings = $currentSelected.parent().children();
  
  if ($currentSelected.is(':last-child')) {
    $allSiblings.first().click();
  } else {
    $currentSelected.next().click();
  }
}

// Call this function whenever you need to trigger the next element click
triggerNextOrderlineClick();

Quick Notes: #

• This assumes your .orderline container holds all the sibling elements you want to cycle through.
• You don’t need to manually manage the selected class here—this code relies on your existing logic that updates the selected class when an element is clicked (the click event itself should handle adding/removing this class).
• The wrap-around logic ensures that when you’re on the final item, clicking "next" will jump straight back to the first element in the list.

内容的提问来源于stack exchange，提问作者Gayan Weerakutti