2011-08-24 20 views
27

html5 input[type=text] elemanlarında yer tutucu özelliğini destekler bağlıyor ama uyumlu olmayan tarayıcıları işlemek gerekir. Yer tutucu için orada binlerce eklenti olduğunu biliyorum ama 1001'i yaratmak istiyorum.jQuery: töre almak değeri

input[placeholder] öğesinde bir tanıtıcı elde edebiliyorum ancak yer tutucu özniteliğinin değerini almaya çalışıyorum undefined - $("input[placeholder]").attr("placeholder").

Jquery 1.6.2 kullanıyorum. İşte

jsfiddle olduğunu. Kodu, test amaçlı olarak html5 uyumlu bir tarayıcıda çalışacak şekilde değiştirdim.

html

<input type="text" name="email" size="10" placeholder="EMAIL ADDRESS"> 

jquery her türlü yardım için

function SupportsInputPlaceholder() { 
    var i = document.createElement("input"); 
    return "placeholder" in i; 
} 

$(document).ready(function(){ 
    if(!SupportsInputPlaceholder()) { 
     //set initial value to placeholder attribute 
     $("input[placeholder]").val($("input[placeholder]").attr("placeholder")); 

     //create event handlers for focus and blur 
     $("input[placeholder]").focus(function() { 
      if($(this).val() == $(this).attr("placeholder")) { 
       $(this).val(""); 
      } 
     }).blur(function() { 
      if($(this).val() == "") { 
       $(this).val($(this).attr("placeholder")); 
      } 
     }); 
    } 
}); 

Teşekkür, val (a işleviyle denilen durumlar dışında

cevap

38

Burada yineleme çeşit gerekir B,

:) sadece ilk elemanın üzerinde çalışır

olmalıdır:

$("input[placeholder]").each(function() { 
    $(this).val($(this).attr("placeholder")); 
}); 

veya

$("input[placeholder]").val(function() { 
    return $(this).attr("placeholder"); 
}); 
+2

olmaz mıydı '$ (" input [tutucu] ") .val (function() {return $ (this) .attr (" yer tutucu "); }); 'daha iyi olmak? –

+0

Teşekkürler Dennis. Her birinde bir kesme noktası belirlediğimde, işleve girmediğini, hatta bu seçiciyle eşleşen herhangi bir öğe bulamadığını fark ettim. Ama $ ($) ("input [placeholder]") üzerine bir saat koyduğumda, val() 'yi görürüm ve eğer elemanın bir değer vermesi durumunda değeri göreceğim. – bflemi3

+0

@Richard Evet, bu biraz daha iyi. Muhtemelen çok fazla farklılık düşünülmedi. bflemi3, Hangi tarayıcıyı kullanıyorsunuz? Kodunuz Chrome ve IE7'de çalışıyor – Dennis

1
Ayrıca onclick olayı ile işlevini geçirerek yapabilirsiniz

<a onlick="getColor(this);" color="red"> 

<script type="text/javascript"> 

function getColor(el) 
{ 
    color = $(el).attr('color'); 
    alert(color); 
} 

</script>