jQuery, .html() veya .val() kullanmam gerekip gerekmediğini otomatik olarak algılar

Question

Uygulamam için tasarlanmış ajax çağrıları oluşturmak için bir jquery eklentisi yazıyorum. Bu eklenti İçinde

, benim ajax çağrısı bu (Hangi soru ihtiyacı düşürüldü) gibi görünür:

$.ajax({ 
     url: route, 
     type: "post", 
     data: inputData, 
     success: function(response, textStatus, jqXHR) { 
      if (outputSelector !== undefined) { 

       $(outputSelector).html(response); 
       // or 
       $(outputSelector).val(response); 

      } 
     } 
    }); 

outputSelector eklenti dışında tanımlanmış bir seçici vardır. Bu seçicinin veya <input> veya hatta <select> olduğunu bilmiyorum. Val() veya html() kullanmam gerekip gerekmediğini bilmenin akıllı bir yolu var mı? eleman value özelliği varsa

Answer 1

Muhtemelen biz kontrol edebilir: Yani

var el = $(outputSelector); 
if (el[0].value !== undefined) { 
    el.val(response); 
} else { 
    el.html(response); 
} 

, biraz bir çizgi gibi evrensel bir çözüm olabilir:

$(outputSelector).each(function() { 
    this[this.value !== undefined ? "value" : "innerHTML"] = response; 
}); 

Answer 2

belirlemek için .is(..) yöntemi kullanabilirsiniz hangi yöntemi kullanmak. Başarınızı Fonksiyonun içerisinde

$.ajax({ 
    url: route, 
    type: "post", 
    data: inputData, 
    success: function(response, textStatus, jqXHR) { 
     if (outputSelector !== undefined) { 
      var $output = $(outputSelector), 
       method = $output.is('input,select,textarea') ? 'val' : 'html'; 

      $output[method](response); 
     } 
    } 
}); 

Answer 3

, koyun:

if (outputSelector !== undefined) { 
    if(outputSelector.is("input")) 
    { 
     outputSelector.val(response); 
    } 
    else if (outputSelector.is("div")) 
    { 
     outputSelector.html(response); 
    } 
} 

bir switch deyimi kullanmak daha iyi sözdizimi olurdu ama sadece giriş val() için kullanılacak varsayalım ve her şey daha sonra html() ise Sadece son else if'u sadece else ile değiştirin ve koşulu kaldırın.

Answer 4

outputSelector, bir sınıf seçicisiyse ve öğeler karma türdeyse, .each'u kullanmanız gerekir. div ve input'u aynı sınıfla karıştırmak iyi olmamasına rağmen, bir eklenti oluşturuyorsanız, bu durumu dikkate almanız gerekir.

$(outputSelector).each(function() { 
    if ('value' in this) { 
     $(this).val(response); 
    } else { 
     $(this).html(response); 
    } 
}); 

Answer 5

Ayrıca bir özellik, belirli bir seçicinin için tanımlanan olup olmadığını belirlemek için .prop() yöntemi kullanabilirsiniz: alternatif

if ($(outputSelector).prop("value") !== undefined) 
    $(outputSelector).val(response); 
else 
    $(outputSelector).html(response); 

EXAMPLE

yapabildin bize .hasOwnProperty()