Я хочу найти элемент ввода, ближайший к промежутку, когда я нажимаю на него, можете ли вы мне помочь?

Question

Я хочу найти входной элемент, ближайший к диапазону, когда я щелкаю его

HTML

<div>
   <span class="text"></span>
   <input type="text" name="an_element_name">
</div>
<div>
   <span class="text"></span>
   <input type="text" name="an_element_name">
</div>

JQuery

$('.text').click(function(e){
   let text = $(e.target),
       input = text.closest('input[name=an_element_name]').find('input[name=an_element_name]');

   input.val('some value');
});

, но Я до сих пор не могу установить значение ввода. Вы можете мне помочь?

Answer 1

Вы используете closest () неправильно, вместо этого следует использовать next () .

next (): Получите сразу после родственного элемента каждого элемента в наборе соответствующих элементов. Если указан селектор, он извлекает следующего родного брата, только если он соответствует этому селектору.

Вы можете достичь этого простым способом

$('.text').click(function(e){
   let text = $(e.target),
       input = text.next('input[name=an_element_name]');

   input.val('some value');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span class="text">Click me</span>
<input type="text" name="an_element_name">

Answer 2

Вам нужно использовать text.next('input[name=an_element_name]');, поскольку .closest() ищет предка вашего диапазона, а не братьев и сестер.

• .closest() = Идет вверх по дереву html и ищет the element.
• .next() = Поиск элемента после текущего элемента.
• .find() = Поиск дочерних элементов данного элемента.

Демо

$('.text').click(function(e){
   let text = $(e.target),
       input = text.next('input[name=an_element_name]');
   input.val('some value');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span class="text">click</span>
<input type="text" name="an_element_name">