一次定位一个文本字段，不使用 ID 时不能一次定位所有文本字段

Question

我尚未完成，但是我计划根据用户输入生成具有PHP的文本字段。因此，如果他们键入3，则应将3个文本字段填充等。

而不是试图给每个文本字段一个ID（我必须将代码应用于编号文本字段并根据他们选择的编号进行增量），我可以选择类或输入吗？我试图这样做，但是通过Ajax搜索，结果在所有文本字段中都出现，而不仅仅是它们正在输入的字段。

    <div class="form-group">
        <input type="text" name="name" autocomplete="off">
        <div class="result"></div>
    </div>
    <div class="form_group">
        <input type="text" name="name" autocomplete="off">
        <div class="result"></div>
    </div>

$(document).ready(function(){
    $("input").keyup(function(){
        $(".loader").show();
        var input = $(this).val();
        if (input.length >3){
              $.ajax({
                  type: 'POST',
                  url: 'insert-ajax.php',
                  data: {name:input},
                  success: function(data){
                      if(!data.error) {
                      $(".result").html(data);
                      $(".loader").hide();
                      }
                  }
              });
            } 
                if (input.length <1) {
                    $(".loader").hide();
                    $(".result").html("");
                }
        });
        $(".result").on( "click", "li", function() {
                console.log($(this).text());
            $("input").val($(this).text());
            });
    });

Answer 1

带有jQuery对象，您可以在此处使用一组很棒的遍历功能。据我了解，在您的每个.results Divs中，您都有一个无序的列表，并且您希望能够单击该列表中的li，并具有最近的文本字段填充值。假设我是对的，您可以使用.closest()函数来获取该li的祖先.results div，然后使用.siblings()函数获取最近的输入字段。所以类似：

$(".result").on( "click", "li", function() {
    console.log($(this).text());
    $(this).closest(".result").siblings("input").val($(this).text());
});

有点混乱，但这会起作用。也就是说，我不确定您为什么要在关键处理程序中进行此操作。它可能会在li标签上添加单击处理程序。

Answer 2

尝试放置

$('input').val($this().text);

在您的密钥函数中，例如

$(this).text(data);

而不是

$('.result').html(data);