Question

我试图根据产品名称将产品详细信息添加到表中，该产品名称可以从以下输入框中收集。

 <input type="text"  autofocus class="form-control" id="productSearch"  placeholder="Product name">

但是问题是在添加值并不能转到上一个输入框后，无法清空文本框。我如何将其设为空白并只聚焦于同一输入框？

 $( "#productSearch" ).change(function(event) {    
  $.ajax({
    type: "get",
    url: "{!! asset('searchByProductName') !!}",
    dataType: 'json',
    data: { name:this.value },
    success: function(response){
      if ($('#' + response.id).length !== 0) {
        return false; 
      }

     var markup = "<tr id="+response.id+"><input type='hidden' name='product_id[]'  value="+response.id+"><td><i class='flaticon-delete-1 delete-row' onclick='deleteRow(this)'></i></td><td>"+response.product_name+"</td><td>"+response.product_unit_price+"</td><td><input type='text' name='quantity[]' class='quantity' value='1'></td><td class='total'>"+response.product_unit_price+"</td><td>"+response.notes+"</td></tr>";

      $("table tbody").append(markup);      
      $(this).val(""); 
      return false; 
      event.preventDefault();
     }   
  }); 
});

Answer 1

问题出在this上，因为它没有引用$("#productSearch")，因为您在函数内部使用了它。由于$("#productSearch")指的是单个元素，因此，如果您使用它代替$(this)，就不会有任何问题。

或者，您可以在event.target中使用context: this或$.ajax，如下所示：

$("#productSearch").change(function(event) {
     $.ajax({
         context: this,
         type: "get",
         url: "{!! asset('searchByProductName') !!}",
         dataType: 'json',
         data: {
             name: this.value
         },
         success: function(response) {
             //...
             $(this).val("");
         }
     });
 });

无法使用$（this）.val（“”）;

1 个答案: