Jak mogę się dowiedzieć, czy przeglądarka obsługuje znacznik zastępczy HTML5, więc mogę zdecydować, czy podpiąć moją wtyczkę jQuery, czy nie.Obsługa HTML5 "placeholder"
Odpowiedz
var placeholderSupported = ('placeholder' in document.createElement('input'));
zmiennej placeholderSupported
będzie true
jeśli jest on natywnie obsługiwane. W przeciwnym razie zostanie ustawiony na false
.
Aby uzyskać szeroki pomysł iść do:
http://caniuse.com/#search=placeholder
I przetestować w przeglądarce można zrobić:
function supportsPlaceholder() {
var i = document.createElement('input');
return 'placeholder' in i;
}
Jeśli chcesz dołączyć bibliotek innych firm, takich jak modernizr i yepnope .js, naprawdę łatwo jest przetestować wsparcie i stopniowo ulepszać, z wdziękiem degradować.
To jest dobry artykuł z dużą ilością zasobów, które powinny pomóc: http://www.sitepoint.com/regressive-enhancement-with-modernizr-and-yepnope/
http://diveinto.html5doctor.com/everything.html#placeholder
return 'placeholder' in document.createElement('input');
jednak plugin jQuery używasz może już być sprawdzanie natywnego wsparcia - to polubisz nie trzeba to zrobić samodzielnie.
To jest piękne. –
+1 dla łącza do AIOAANBGTDE –
Obsługa jQuery jest prosta; '$ .support.placeholder' – mattclegg
pożyczyłem z odpowiedzi powyżej zrobiłem to tak, że jest kompatybilny wstecznie ze starszymi nowoczesnych przeglądarkach, a także IE -
z poniższym kodzie, upewnij się, że zarówno „wartość” i „zastępczy "zestaw atrybutów dla pól wejściowych. W moim konkretnym przypadku musiałem wspierać warianty IE.
Wyjaśnienie - Jeśli przeglądarka obsługuje symbol zastępczy, wartość wejściowa zostanie usunięta. Jeśli nie, starsze przeglądarki zignorują atrybuty zastępcze, a poniższy js naśladuje domyślne zachowanie zastępcze. Ten skrypt będzie także ignorował wszystkie tokeny uwierzytelnienia dla CSRF (otrzymywał błąd, w którym wartości tokenów auth zostały usunięte w moich formularzach powodując ostrzeżenie CSRF w moich aplikacjach Railsowych).
Innym sposobem na uproszczenie samego skryptu jest przypisanie klasy do każdego wejścia, którego chcesz użyć i zaktualizowanie prawdziwej instrukcji (chociaż poniższa metoda jest nieco bardziej sucha).
var placeholderSupported = !!('placeholder' in document.createElement('input'));
if (placeholderSupported === true){
$('input:not([type="submit"], [name="authenticity_token"])').val('');
} else{
$('input')
.focus(function() {
if (this.value === this.defaultValue) {
this.value = '';
}
})
.blur(function() {
if (this.value === '') {
this.value = this.defaultValue;
}
});
}
- 1. Obsługa Doctype HTML5
- 2. Obsługa HTML5 i RDFa
- 3. Obsługa interfejsu API wibracji HTML5
- 4. Obsługa zdarzeń magazynowania HTML5/JS
- 5. java swing JTextField set PlaceHolder
- 6. Obsługa AngularJS html5 na stronach GitHub
- 7. Nowa obsługa interfejsu API HTML5 Canvas
- 8. Korzystanie z HTML Placeholder w Laravel 4
- 9. QString :: arg() z numerem po placeholder
- 10. ASP.NET MVC 3: Obsługa przesyłania wielu plików HTML5?
- 11. Obsługa zdarzeń HTML5 (onfocus i onfocusout) przy użyciu kątowego 2
- 12. HTML5 jako symbol zastępczy
- 13. Jak dodać placeHolder Text w UItextView? w iPhone SDK
- 14. React JSX: Jak ustawić rekwizyty do atrybutu placeholder
- 15. ASP.NET MVC i HTML5
- 16. Dynamic HTML5 Datalist
- 17. Zastępstwo zastępcze formularza HTML5 z walidacją formularza w prototypie
- 18. Dodawanie obsługi atrybutów niestandardowych (HTML5) do składnika JSF 2.0 UIInput
- 19. HTML5 kontra XFBML? Na stronie HTML5?
- 20. Podstawowa struktura prezentacji przy użyciu HTML5 + javascript
- 21. sprawdzanie poprawności formularza html5, anulowanie działania formularza i wykonanie jQuery po sprawdzeniu poprawności wszystkich elementów formularza html5?
- 22. JSF 2.0 usuwa wymagane atrybuty HTML5
- 23. HTML5 & ACCESSKEY
- 24. asynchronizacja html5
- 25. Obsługa zdarzeń Select2 za pomocą Angular js
- 26. Selektor daty w systemie iOS HTML5 nie akceptuje szerokości: 100%;
- 27. Jak zapisać dane z formularza za pomocą lokalnego magazynu HTML5?
- 28. Ręczne wyzwalanie sprawdzania poprawności html5 na przycisku kliknij
- 29. Czy obsługa atrybutów danych HTML 5 w starych przeglądarkach?
- 30. Element zastępczy HTML5 IE9 - w jaki sposób ludzie to osiągają?
Dlaczego potrzebujesz !! w wyrażeniu? – hop
@hop - Masz rację. Ja nie. Zaktualizowano. –