kzen.dev
  • Otázky
  • Značky
  • Používatelia
Oznámenia
Odmeny
Registrácia
Po registrácii budete informovaní o odpovediach a komentároch na vaše otázky.
Prihlásiť sa
Ak už máte konto, prihláste sa a skontrolujte nové oznámenia.
Za pridané otázky, odpovede a komentáre budú udelené odmeny.
Viac na
Zdroj
Upraviť
 Andrew
Andrew
Question

Ako vytvoriť tlačidlo HTML, ktoré sa správa ako odkaz?

Chcel by som vytvoriť tlačidlo HTML, ktoré sa správa ako odkaz. Takže po kliknutí na tlačidlo sa presmeruje na stránku. Chcel by som, aby bolo čo najprístupnejšie.

Chcel by som tiež, aby v adrese URL neboli žiadne ďalšie znaky alebo parametre.

Ako to môžem dosiahnuť?


Na základe doteraz zverejnených odpovedí to v súčasnosti robím:

<form method="get" action="/page2">
    <button type="submit">Continue</button>
</form>

ale problém je v tom, že v prehliadačoch Safari a Internet Explorer sa na koniec adresy URL pridáva znak otáznika. Potrebujem nájsť riešenie, ktoré nepridáva na koniec adresy URL žiadne znaky.

Existujú dve ďalšie riešenia, ako to urobiť: Použitie JavaScriptu alebo štylizácia odkazu tak, aby vyzeral ako tlačidlo.

Použitie JavaScriptu:

<button onclick="window.location.href='/page2'">Continue</button>

To však samozrejme vyžaduje JavaScript, a preto je menej prístupné pre čítačky obrazovky. Zmyslom odkazu je prejsť na inú stránku. Takže snaha o to, aby sa tlačidlo správalo ako odkaz, je nesprávnym riešením. Môj návrh je, aby ste použili odkaz a naštýlovali ho tak, aby vyzeral ako tlačidlo.

<a href="/link/to/page2">Continue</a>
1758 2010-05-25T16:39:47+00:00 3
 Community
Community
Edited question 23 máj 2017 в 12:03
Internet Explorer - Wikipedia
en.wikipedia.org
Safari (web browser) - Wikipedia
en.wikipedia.org
Programovanie
button
html
hyperlink
anchor
htmlbutton
Popular videos
How to Add an HTML Button that Acts Like a Link?
How to Add an HTML Button that Acts Like a Link?
pred 2 rokmi
How to Create an HTML button that acts like a Link 🔗 2021
How to Create an HTML button that acts like a Link 🔗 2021
pred rokom
Create An HTML Button That Acts Like A Link
Create An HTML Button That Acts Like A Link
pred 6 rokmi
[HTML-Tutorial-19] Basic Form | form, input, label, button elements | Web Development for Beginners
[HTML-Tutorial-19] Basic Form | form, input, label, button elements | Web Development for Beginners
pred 2 rokmi
HTML button tags in hindi / topic - 7
HTML button tags in hindi / topic - 7
pred 2 rokmi
HTML Form Tag (How to make Registration Form) Urdu / Hindi | Lecture 8
HTML Form Tag (How to make Registration Form) Urdu / Hindi | Lecture 8
pred rokom
#Website |How to Make Forms in HTML |Last Lecture of HTML |Web Designing Course | Batch 1st 2020
#Website |How to Make Forms in HTML |Last Lecture of HTML |Web Designing Course | Batch 1st 2020
pred 2 rokmi
Button tag - button tag in html | button tag in html in hindi | how to create submit button in html
Button tag - button tag in html | button tag in html in hindi | how to create submit button in html
pred 2 rokmi
HTML Tutorial in Hindi [Part 14] - link one page to another html
HTML Tutorial in Hindi [Part 14] - link one page to another html
pred 2 rokmi
Address tag | HTML in Hindi | DJVM Tech Point
Address tag | HTML in Hindi | DJVM Tech Point
pred rokom
HTML BUTTON TAG IN URDU AND HINDI |  Web Development Tutorials For Beginners In Urdu And Hindi
HTML BUTTON TAG IN URDU AND HINDI | Web Development Tutorials For Beginners In Urdu And Hindi
pred 2 rokmi
HTML Tutorial 55 - Different types of button in HTML
HTML Tutorial 55 - Different types of button in HTML
pred 6 rokmi
الدرس  5 HTML  شعبة TDI السنة التانية
الدرس 5 HTML شعبة TDI السنة التانية
pred 3 rokmi
How To Create Form in Notepad++ || How To Make  Form in HTML (Lesson No 6)
How To Create Form in Notepad++ || How To Make Form in HTML (Lesson No 6)
pred 2 rokmi
« Predchádzajúci
Ďalšie »
This question has 1 odpoveď in English, to read them log in to your account.
Solution / Answer
 BalusC
BalusC
25 máj 2010 в 4:40
2010-05-25T16:40:49+00:00
Viac na
Zdroj
Upraviť
#10501911

HTML

Jednoduchý spôsob HTML je umiestniť ho do <formulára>, kde v atribúte action uvediete požadovanú cieľovú adresu URL.

<form action="http://google.com">
    <input type="submit" value="Go to Google" />
</form>

Ak je to potrebné, nastavte na formulári CSS display: inline;, aby bol v toku s okolitým textom. Namiesto <input type="submit"> vo vyššie uvedenom príklade môžete použiť aj <button type="submit">. Jediný rozdiel je v tom, že prvok <button> umožňuje použitie detí.

Intuitívne by'ste očakávali, že budete môcť použiť <button href="http://google.com"> analogicky s elementom <a>, ale bohužiaľ nie, tento atribút podľa špecifikácie HTML neexistuje.

CSS

Ak je CSS povolené, jednoducho použite <a>, ktorý naštartujete tak, aby vyzeral ako tlačidlo, okrem iného pomocou vlastnosti appearance (len podpora Internet Explorer je v súčasnosti (júl 2015) stále slabá).

<a href="http://google.com" class="button">Go to Google</a>
a.button {
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;

    text-decoration: none;
    color: initial;
}

Alebo si vyberte jednu z mnohých knižníc CSS, napríklad Bootstrap.

<a href="http://google.com" class="btn btn-default">Go to Google</a>

JavaScript

Ak je povolený JavaScript, nastavte window.location.href.

<input type="button" onclick="location.href='http://google.com';" value="Go to Google" />
 BalusC
BalusC
Edited answer 4 august 2016 в 10:53
Can I use... Support tables for HTML5, CSS3, etc
&quot;Can I use&quot; provides up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.
caniuse.com
Mozilla logo
developer.mozilla.org
1962
0
 ghoppe
ghoppe
25 máj 2010 в 4:41
2010-05-25T16:41:42+00:00
Viac na
Zdroj
Upraviť
#10501912
<form>
    <input TYPE="button" VALUE="Home Page"
        onclick="window.location.href='http://www.wherever.com'"> 
</form>
Peter Mortensen
Peter Mortensen
Edited answer 21 júl 2014 в 3:22
25
0
Pekka  supports GoFundMonica
Pekka supports GoFundMonica
25 máj 2010 в 4:41
2010-05-25T16:41:43+00:00
Viac na
Zdroj
Upraviť
#10501913

Jediný spôsob, ako to urobiť (okrem geniálneho nápadu s formulárom BalusC'a), je pridať k tlačidlu udalosť JavaScript onclick, čo nie je dobré pre prístupnosť.

Uvažovali ste o tom, že by ste normálny odkaz štylizovali ako tlačidlo? Takýmto spôsobom síce nedosiahnete tlačidlá špecifické pre OS, ale aj tak je to IMO najlepší spôsob.

Peter Mortensen
Peter Mortensen
Edited answer 21 júl 2014 в 3:24
16
0
Pridať otázku
Kategórie
Všetky
Technológia
Kultúra / Rekreácia
Život / Umenie
Veda
Profesionálne
Obchod
Používatelia
Všetky
New
Popular
1
bran Bran
Registered pred 12 hodinami
2
Олечка Арапова
Registered pred 18 hodinami
3
Роман Азаров
Registered pred týždňom
4
Mansur Zakirov
Registered pred týždňom
5
Тагир Мамедов
Registered pred 2 týždňami
BG
DA
DE
EL
ES
FR
HU
ID
IT
JA
LV
NL
PT
RU
SK
TR
ZH
© kzen.dev 2023
Zdroj
stackoverflow.com
na základe licencie cc by-sa 3.0 s uvedením autora