inputjest pustym elementem. Nie używaj <input />, po prostu używaj <input>.
CDT
@ HakanFıstık, a nie dup z tym, tam, to jest (mniej lub bardziej subtelnie) inna, na przykład type=submitdla buttonnawet nie było problemem tam (prawdopodobnie dlatego, że nie było jeszcze częścią std. Wtedy (AFAIK), kiedy zadawano to inne pytanie).
Sz.
Odpowiedzi:
120
Nie jestem pewien, skąd bierzesz swoje legendy, ale:
Przycisk Prześlij z <button>
Jak z:
<buttontype="submit">(html content)</button>
IE6 prześle cały tekst tego przycisku między tagami, inne przeglądarki prześle tylko wartość. Użycie <button>zapewnia większą swobodę układu w projektowaniu przycisku. Pod względem wszystkich swoich zamiarów i celów wydawał się na początku doskonały, ale różne dziwactwa przeglądarki czasami utrudniają korzystanie z niego.
W twoim przykładzie IE6 wyśle textna serwer, podczas gdy większość innych przeglądarek nic nie wyśle. Aby był kompatybilny z różnymi przeglądarkami, użyj <button type="submit" value="text">text</button>. Jeszcze lepiej: nie używaj wartości, ponieważ jeśli dodasz HTML, stanie się raczej trudne, co jest odbierane po stronie serwera. Zamiast tego, jeśli musisz wysłać dodatkową wartość, użyj ukrytego pola.
Przycisk z <input>
Jak z:
<inputtype="button"/>
Domyślnie to prawie nic. Nie prześle nawet Twojego formularza. Możesz tylko umieścić tekst na przycisku i nadać mu rozmiar i obramowanie za pomocą CSS. Jego pierwotnym (i obecnym) zamiarem było wykonanie skryptu bez konieczności przesyłania formularza na serwer.
Zwykły przycisk przesyłania z <input>
Jak z:
<inputtype="submit"/>
Podobnie jak poprzedni, ale w rzeczywistości przekazuje otaczającą formę.
Przycisk przesyłania obrazu z <input>
Jak z:
<inputtype="image"/>
Podobnie jak pierwsza (wyślij), również prześle formularz, ale możesz użyć dowolnego obrazu. Kiedyś był to preferowany sposób używania obrazów jako przycisków, gdy trzeba było przesłać formularz. Dla większej kontroli <button>jest teraz używany. Może być również używany do map obrazu po stronie serwera, ale w dzisiejszych czasach jest to rzadkość. Kiedy użyjesz usemap-attribute i (z tym atrybutem lub bez), przeglądarka wyśle współrzędne X / Y wskaźnika myszy do serwera (a dokładniej, lokalizacja wskaźnika myszy wewnątrz przycisku w momencie kliknięcia). Jeśli po prostu zignorujesz te dodatki, to nic innego jak przycisk przesyłania przebrany za obraz.
Istnieją pewne subtelne różnice między przeglądarkami, ale wszystkie przesyłają atrybut wartość, z wyjątkiem <button>tagu, jak wyjaśniono powyżej.
Ponieważ i tak edytujesz, kwestia dotycząca IE6 jest nadal aktualna w przypadku IE11 w trybie dziwactw. (Kolejny powód, aby nie używać trybu dziwactw). Naprawiono jednak w Edge. Aha, i jest więcej różnic między <input> a <button>: <input> ma white-space:predomyślnie <button> nie. Staje się to widoczne podczas próby poszerzenia przycisku niż rzutnia.
Pan Lister
19
W programie <button>możesz używać tagów img itp. Tam, gdzie znajduje się tekst
<buttontype='submit'> text -- can be img etc. </button>
z <input type="image" />tobą nie ogranicza się do tekstu, a także wykonuje przesyłanie.
Abel
2
@Abel: to więcej, aby stworzyć mapę obrazu, który z kolei wysyła wskaźnik myszy pozycję jak name.xi name.yparametry (zauważ, że nameparametr nie jest obecny!). Wolałbym używać <input type="submit">tła CSS, jeśli jedynym celem jest posiadanie przycisku z obrazem tła.
BalusC
@BalusC: To prawda, ale celem, w momencie pisania standardu HTML 2.0, kiedy nie było CSS, było, zgodnie z opisem, użycie obrazu jako przycisku lub jako mapy obrazu po stronie serwera. Ale rzeczywiście, możesz (ab) użyć zwykłego przycisku z obrazem tła, aby zrobić to samo z CSS i HTML.
Abel
@Abel: To nigdy nie było zamiarem input type="image". Do tego <button type="submit">jest przeznaczony.
BalusC
1
@BalusC: być może inaczej rozumiemy ten standard, ale to jest w oryginalnym tekście Lee dotyczącym standardu HTML 2.0: Przetwarzanie „ TYPE=IMAGE' implies TYPE = SUBMIT”; to znaczy, gdy wybrany jest piksel, przesyłany jest cały formularz. ” . Zrób z tego to, co myślisz, jest prawdziwym zamiarem :)
<input type="submit">i<button type="submit">?inputjest pustym elementem. Nie używaj<input />, po prostu używaj<input>.type=submitdlabuttonnawet nie było problemem tam (prawdopodobnie dlatego, że nie było jeszcze częścią std. Wtedy (AFAIK), kiedy zadawano to inne pytanie).Odpowiedzi:
Nie jestem pewien, skąd bierzesz swoje legendy, ale:
Przycisk Prześlij z
<button>Jak z:
IE6 prześle cały tekst tego przycisku między tagami, inne przeglądarki prześle tylko wartość. Użycie
<button>zapewnia większą swobodę układu w projektowaniu przycisku. Pod względem wszystkich swoich zamiarów i celów wydawał się na początku doskonały, ale różne dziwactwa przeglądarki czasami utrudniają korzystanie z niego.W twoim przykładzie IE6 wyśle
textna serwer, podczas gdy większość innych przeglądarek nic nie wyśle. Aby był kompatybilny z różnymi przeglądarkami, użyj<button type="submit" value="text">text</button>. Jeszcze lepiej: nie używaj wartości, ponieważ jeśli dodasz HTML, stanie się raczej trudne, co jest odbierane po stronie serwera. Zamiast tego, jeśli musisz wysłać dodatkową wartość, użyj ukrytego pola.Przycisk z
<input>Jak z:
Domyślnie to prawie nic. Nie prześle nawet Twojego formularza. Możesz tylko umieścić tekst na przycisku i nadać mu rozmiar i obramowanie za pomocą CSS. Jego pierwotnym (i obecnym) zamiarem było wykonanie skryptu bez konieczności przesyłania formularza na serwer.
Zwykły przycisk przesyłania z
<input>Jak z:
Podobnie jak poprzedni, ale w rzeczywistości przekazuje otaczającą formę.
Przycisk przesyłania obrazu z
<input>Jak z:
Podobnie jak pierwsza (wyślij), również prześle formularz, ale możesz użyć dowolnego obrazu. Kiedyś był to preferowany sposób używania obrazów jako przycisków, gdy trzeba było przesłać formularz. Dla większej kontroli
<button>jest teraz używany. Może być również używany do map obrazu po stronie serwera, ale w dzisiejszych czasach jest to rzadkość. Kiedy użyjeszusemap-attribute i (z tym atrybutem lub bez), przeglądarka wyśle współrzędne X / Y wskaźnika myszy do serwera (a dokładniej, lokalizacja wskaźnika myszy wewnątrz przycisku w momencie kliknięcia). Jeśli po prostu zignorujesz te dodatki, to nic innego jak przycisk przesyłania przebrany za obraz.Istnieją pewne subtelne różnice między przeglądarkami, ale wszystkie przesyłają atrybut wartość, z wyjątkiem
<button>tagu, jak wyjaśniono powyżej.źródło
white-space:predomyślnie <button> nie. Staje się to widoczne podczas próby poszerzenia przycisku niż rzutnia.W programie
<button>możesz używać tagów img itp. Tam, gdzie znajduje się tekstz
<input>tekstem jesteś ograniczony do tekstuźródło
<input type="image" />tobą nie ogranicza się do tekstu, a także wykonuje przesyłanie.name.xiname.yparametry (zauważ, żenameparametr nie jest obecny!). Wolałbym używać<input type="submit">tła CSS, jeśli jedynym celem jest posiadanie przycisku z obrazem tła.input type="image". Do tego<button type="submit">jest przeznaczony.TYPE=IMAGE' impliesTYPE = SUBMIT”; to znaczy, gdy wybrany jest piksel, przesyłany jest cały formularz. ” . Zrób z tego to, co myślisz, jest prawdziwym zamiarem :)W podsumowaniu :
Oba domyślnie narysują wizualnie przycisk, który wykonuje tę samą akcję (wyślij formularz).
Jednak zaleca się go używać,
<button type="submit">ponieważ ma lepszą semantykę, lepszą obsługę ARIA i jest łatwiejszy do stylizacji.źródło