獲取搜索結果來顯示ul輸入的文本字段

Question

我想用類而不是ID來使用jQuery，因爲我將處於這樣一種情況，即根據用戶輸入而生成由php生成的相同文本字段。當用戶開始輸入時，會出現一個加載器，然後第四個按鍵輸出結果將通過php/ajax顯示在無序列表中。我遇到的問題是，當用戶輸入到文本字段中時，對於文本字段1和2，無序列表都會顯示，因爲它應該只出現在輸入的任何文本字段中。

我試過類似的東西，但它不會產生任何結果，並且控制檯不會給我任何錯誤。

$(".result").closest("ul").html(data); 

下面是完整的代碼（HTML）

<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> 

jQuery的

$(document).ready(function() { 
$("input").keyup(function() { 
    var input = $(this).val(); 
    $(".loader").show(); 
    if (input.length > 3) { 
     $.ajax({ 
      type: 'POST', 
      url: 'insert-ajax.php', 
      data: { 
       name: input 
      }, 
      success: function(data) { 

       if (!data.error) { 
        //$(".result").html(data); 
        $(".result").closest("ul").html(data); 
        $(".loader").hide(); 
       } 
      } 

     }); 
    } 

    if (input.length < 1) { 
     $(".loader").hide(); 
     $(".result").html(""); 
    } 
}); 

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

}); 

PHP呼應UL和李

while($row = $result->fetch_assoc()) { 
      $search_result = $row['short_desc']; 
      echo "<ul>"; 
      echo "<li>" . $search_result . "</li>"; 
      echo "</ul>"; 

Answer 1

那麼你的所有選擇.result在你的更新中，你可以se jQuery.ajax中的上下文來定位特定元素

$.ajax({ 
     type: 'POST', 
     url: 'insert-ajax.php', 
     context: this, 
     data: { 
      name: input 
     }, 
     success: function(data) { 

      if (!data.error) { 
       $(this).html(data); 
       $(".loader").hide(); 
      } 
     } 

    });