Question

嗨，我想将文本设置为当前元素旁边的跨度。

NoodlesVendingMachine

我想在我的输入（跨度）旁边看到该文本。但这不起作用。

Answer 1

我认为这会做您想要的，因为不需要使用同级和等式

<script>
    $(".myText").each(function(){
         $(this).next("span.text-danger").text("someText");   
    })
</script>

Answer 2

您可以使用nextElementSibling

$('.myText').on('input',function(){
  this.nextElementSibling.innerHTML = this.value
})

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

Answer 3

要选择下一个元素，请使用next（）函数，例如，如果要在范围中写入输入值，可以使用以下函数：

keyup（）执行代码： https://www.w3schools.com/jquery/event_keyup.asp
next（）选择输入标签https://www.w3schools.com/jquery/traversing_next.asp的下一个元素
val（）获取输入值 https://www.w3schools.com/jquery/html_val.asp

所以您的最终代码应该是这样的：

  <script data-require="jquery" data-semver="3.2.1" src="https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js"></script>
 
 <input type="text" class="myText" />
  <span class="text-danger"></span>

  <input type="text" class="myText" />
  <span class="text-danger"></span>

  <script>
    $(".myText").keyup(function(){
    $(this).next().text($(this).val());
});
  </script>

Answer 4

您根本不需要循环，并且jquery具有一个.next()选择器，因此只需$(".myText").next().text("someText");就可以解决问题。

$(".myText").next().text("someText");

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

是否有任何理由需要首先选择.myText元素，然后找到下一个？您可以直接选择$('.text-danger')

如何找到当前元素的下一个元素？

4 个答案: