Chrome jQuery veya Direct CSS özelliği tarafından ayarlanan Chrome'u görüntülemiyor

Question

Bu bir tasarım/css sorusu gibi görünebilir, ancak biraz yardıma ihtiyacım var.

Bu

O krom hariç akla gelebilecek her tarayıcılarda çalışır sayfa http://library.permilia.com/Gavin/version2.0_beta/lead.html

olduğunu.

Bu, kırmızı kenarlık olan 1px katı # f00 için sınırları belirleyen bir sınıf .error uyguladığı anlamına gelir. Bazı sebeplerden dolayı kromda ne olursa olsun değiştiremezsin!

Herhangi bir fikri olan var mı?

Answer 1

Bu yüzden, yanıt şu ki, JS kodunuz hiçbir zaman ateş etmiyor, çünkü Chrome form doğrulama da dahil olmak üzere HTML5 giriş öğelerini uyguluyor. Bu nedenle, alanları doğru bir şekilde doldurmadıkça, doğrulama kodunuz asla yanmaz!

HTML5'te, required özniteliği bir faldır, ya doğru ya da yanlıştır. the spec'a göre, tarayıcı sorun alanında bir invalid olayını tetiklemelidir. İsterseniz bu noktada varsayılan engelleme davranışını iptal edebilirsiniz. Ancak, komut dosyanız attr('required')'u denediğiniz yerde yeniden bozulur. true veya false, Chrome'da, HTML5'i kullanarak, beklediğiniz gibi email gibi bir değer döndürmeyecektir. Bunu çalışmak istiyorsanız

Ee bu iki parça eklemek gerekir: Sonra

$(":input").bind("invalid", function(e){ 
    e.preventDefault(); // Don't block the form submit 
}); 

Ve yeniden faktör

var a = $(this).attr('required'); 

adresinin kod olmaya

var a = $(this).attr('required') ? $(this).attr('type') : ""; 

Gerekirse anahtar bildiriminizi değiştirin.

Son bir fikirdir: Ayrıca (aka Detection Özelliği) çok güzel bir yaklaşım ve bunun yerine bunu:

Örtecek bu özelliğiyle mevcut validate: fonksiyonun içini:

if(typeof $('<input />')[0].checkValidity === "undefined") { 
    ... existing code .. 
} else { 
    $(':input').bind('invalid', function(){ 
    $(this).addClass('error'); 
    }).blur(function(){ 
    // If valid, turn off error 
    // If invalid, turn on error 
    $(this).toggleClass('error', !this.checkValidity()); 
    }); 
} 

Here is a demo Chrome'da çalışacak ikinci sürümden ve muhtemelen güncel bir Opera sürümü.

Answer 2

CSS dosyanız, "arka plan rengi" ayarını değil değil. "* Arka plan rengi" ayarlanıyor. IE kesmekse muhtemelen bir çeşit, ancak "gerçek" stil özelliğini ("arka plan rengi") yıldız işareti olmadan ayarlamanız gerekir.